What is block?
block은<header>, <footer>, <p>, <li>, <table>, <div>, <h1>처럼 바로 옆에 다른 무언가가 오지 못하는 것을 가르킨다.
inline은 <span>, <a>, <img>처럼 바로 옆에 무언가가 올 수가 있고 미치는 범위도 그 칸 만큼 차지한다.
그렇지만 block <- -> inline 의 특성을 바꿀수가 있다.
display: inline-block; 으로
원래는 block 인 것도 inline처럼 사용이 가능하다.
.inline-p {
display: inline-block;
}
.float-left {
float: left;
}
.float-right {
float: right;
}
여기를 보면 p는 block의 특징을 가지고 있지만 inline으로 할 수 있게끔 하는 클래스 inline-p가 있다.
.hide {
display: none;
} -> 이렇게 하면 화면에는 아무것도 보이지 않게 된다.