맵크나이트의 마라탐방

===== .parent{ background-color:dodgerblue; width: 600px; height: 300px; position: relative; } position: relative;를 안줄경우 상속받은 child는 브라우저자체가 부모라고 생각해서 파란색 범위를 넘어가서 브라우저 끝에 위치하게 된다 .child{ background-color: crimson; width:200px; height:100px; position:absolute; right:0; botton:0; } 부모는 position: relative; 자식은 position:absolute; 이 속성을 줬다고 해서 변화가 일어나지는 않으나 position:absolute;를 안줄경우 속성은 반드시 포지션속성이 있어..

.parent{ border:5px solod red; width: 600px; overflow:hidden; ==>부모가 높이값을 잃었을때(자식요소에float:속성이 들어가면 부모는 높이속성을 잃어버림) 높이값을 찾아주는 방법,height로 자식과 맞춰주는 방법, overflow:hidden; 을 주면 자식요소의 높이값에 따라 자동변환해줌 } .chaild{ background-color:gold; width:200px; height:100px; float:left; }

-인라인요소 1.한줄에 여러개 배치 2.기본 너비값은 컨텐츠의 너비값 3.크기값을 가질 수 없음 4.상하 마진은 가질 수 없음 span, a, br, b.... -블록요소 1.한줄에 한개만 배치 2.기본 너비값은 100% 3.크기값을 가질 수 있음 4.상하좌우 마진 가질 수 있음 div, table, figure, figcaption, header, nav, footer, form, hr, ul, ol, li, ,td, th, h1~h6... -인라인블록 1.한줄에 여러개 배치 2.기본 너비값은 컨텐츠의 너비 3.크기값을 가질 수있음 4.상하마진은 가질 수 없음 img, input, button