적용되지 않는 이유: 상위 요소의 높이가 결정되지 않아 "height:XX%" 스타일을 효과적으로 사용할 수 없습니다. 해결 방법: 높이 속성을 사용하여 상위 요소의 특정 높이를 설정하면 하위 요소의 높이 설정 비율이 적용될 수 있습니다.
이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
div에 대한 height:50%
설정과 같이 블록 수준 요소에 대해 반응형 높이를 설정할 때 효과를 보지 못하는 경우가 많습니다.
그 이유는 백분율 크기가 상위 요소의 너비 및 높이를 기준으로 하기 때문입니다. 예를 들어 가장 바깥쪽 요소에 의해 설정된 백분율은 화면에 해당합니다.
너희가 이해해야 할 점은 너비의 경우 상위 요소가 너비를 결정하지 않고 백분율을 설정할 수 있다는 것입니다.
하지만 높이가 다릅니다.요소의 상위 요소가 높이를 결정하지 않는 경우 높이는 XX%입니다. 스타일을 효과적으로 사용할 수 없습니다! ! !
위 문단을 읽고 body{heigh: 100%}를 추가하려고 했으나 소용이 없었습니다...
잘 생각해 봅시다~~~, body의 부모 요소 높이 설정 아직 다운 안됐나요? ? ? ? ? ? 아니요~~아직 효과가 없습니다
그래서 html 요소의 높이를 설정해야 합니다! ! 또는 *{}
코드는 다음과 같습니다
*{ margin:0px; padding: 0px; } html,body{ margin: 0px; background:url(../img/body_bg.jpg) no-repeat 0 0; width:100%; height:100%; } .nav{ width:100%; height:20%; border: 1px solid red; } .nav>img{ width:100%; height: 100%; }
에서 높이 백분율을 설정하세요. 프로그래밍 관련 지식을 더 보려면 프로그래밍 비디오를 방문하세요! !
위 내용은 CSS 높이 설정 비율이 적용되지 않으면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!