디스플레이 이해:인라인; 및 부동:왼쪽;_CSS/HTML

우선, display:inline;과 float:left;의 정확한 의미를 명확히 해야 합니다. 디스플레이: inline; (인라인) "CSS 최종 가이드" 중국어 텍스트 디스플레이: 블록 수준 요소가 아닌 모든 표시 요소는 인라인 요소입니다. 성능의 특징은 "행 레이아웃" 형식입니다. 여기서 "행 레이아웃"은 표현 형식이 항상 행으로 표시된다는 의미입니다. 예를 들어 인라인 요소 border-bottom:1px solid #000;을 설정하면 각 줄에서 반복되며 각 줄 아래에 얇은 검정색 선이 생깁니다. 블록 수준 요소인 경우 표시된 검은색 선은 블록 아래에만 나타납니다.

물론 이것은 display:inline;과 float:left;의 차이는 아닌 것 같지만 float:left;의 특성을 이해하면 무슨 일이 일어나는지 이해할 수 있습니다. float:left;(왼쪽 부동)는 지정된 요소를 일반 문서 흐름에서 벗어나게 하는 특수 레이아웃 기능입니다. 그리고 FLOAT는 블록 수준 요소에 적용되어야 합니다. 즉, 인라인 태그에는 플로팅이 적용되지 않습니다. 즉, FLOAT가 적용되면 이 요소는 블록 수준 요소로 지정됩니다.

그러면 매우 명확합니다. 인라인(display:inline;) 요소에는 너비와 높이를 설정할 수 없습니다. 인라인은 라인 레이아웃에 속하고 특성이 한 줄에 배치되므로 너비와 높이를 설정할 수 없습니다. 설정할 수 없습니다.