1) display 수정 float 속성이 추가된 요소는 display 속성의 값이 대부분 block으로 수정됨 사용법 1. float 속성 추가전 html 1 2 3 css span { width: 100px; height: 100px; margin: 10px; background: tomato; } 출력결과 2. flaot 속성 추가 후 html 1 2 3 css span { width: 100px; height: 100px; margin: 10px; background: tomato; float: left; } 출력결과 주의사항 지정값 변화값 inline block inline-block block inline-table block table-row block table-row-group block..
1) display 요소의 박스 타입(유형)을 설정 속성 값 값 의미 기본값 block 블록 요소( 등) inline 인라인 요소( 등) inline-block 인라인-블록 요소( 등) 기타 table, table-cell, flex 등 none 요소의 박스 타입이 없음(요소가 사라짐) ※ block: 가로, 세로, 패딩, 마진 사용 가능 ※ inline: 가로, 세로, 패딩, 마진 사용 불가능, 우측으로 쌓임, 텍스트를 다루는데 특화 ※ inline-block: inline의 특성을 가지지만 가로, 세로, 패딩, 마진의 위아래를 사용 가능 display: none; 화면에서 사라짐 사용법 ※ span태그는 inline요소이기 때문에 width, height값이 안 먹혀서 아무것도 출력이 되지 않는다. ..