CSS 차원 속성
CSS의 차원 속성은 요소의 높이와 너비를 제어 할 수 있습니다.
이 요소는 100 %의 폭을 갖는다.
설정 높이와 폭
height 및 width 특성 요소의 높이와 폭을 설정하는 데 사용된다.
height 및 width (이. 기본값 브라우저 높이와 너비를 계산하는 수단), 또는 길이 값에서 지정 될 같이 자동으로 설정 될 수 px, cm 등, 또는 퍼센트 (%) 포함하는 블록의 .
참고 : height 와 width 속성 패딩, 테두리, 또는 여백을 포함하지 않는다; 그들 원소의 높이 / 패딩 테두리 내부 영역의 폭 및 여백 세트!
다음의 예는 도시 <div> 100 픽셀, 높이 500 픽셀의 폭을 갖는 소자 :
최대 폭 설정
max-width 속성은 요소의 최대의 폭을 설정하는 데 사용된다.
max-width 같은 길이 값을 지정할 수 있습니다 px, cm 등, 또는 백분율 (%) (이 기본값입니다. 수단에는 최대 너비가 있다는 것을) 포함하는 블록으로, 또는 없음으로 설정합니다.
의 문제점 <div> 브라우저 창은 소자 (500 픽셀)의 폭보다 작은 경우에 상기 발생한다. 브라우저는 다음 페이지에 가로 스크롤 막대를 추가합니다.
사용 max-width 대신에,이 상황에서, 작은 창 브라우저의 취급이 향상됩니다.
팁 :이 div의 차이를보고,보다 작은 500 픽셀 폭으로 브라우저 창을 드래그!
참고 : 값 max-width 특성 재 지정의 width .
다음의 예는 도시 <div> 100 픽셀, 높이 500 픽셀의 최대 폭과 소자 :
그것을 자신을 시도 - 예를
요소의 높이와 폭을 설정
본 실시 예는 다른 요소의 높이와 폭을 설정하는 방법을 보여준다.
화상하여 퍼센트의 높이와 폭을 설정
이 예는 퍼센트 값을 사용하여 이미지의 높이와 폭을 설정하는 방법을 보여준다.
설정 분 너비 요소와 최대 폭
이 예에서는 최소 폭 및 화소 값을 이용하여 소자의 최대 폭을 설정하는 방법을 보여준다.
설정 최소 높이와 요소의 최대 높이
이 예는 최소의 높이 및 화소 값을 사용하여 소자의 최대 높이를 설정하는 방법을 보여준다.
연습으로 자신을 테스트!
모든 CSS 차원 속성
| 재산 | 기술 |
|---|---|
| height | 요소의 높이를 설정 |
| max-height | 요소의 최대 높이를 설정 |
| max-width | 요소의 최대 폭을 설정 |
| min-height | 소자의 최소 높이를 설정 |
| min-width | 소자의 최소 폭을 설정 |
| width | 요소의 폭을 설정 |