JavaScript가 없으면 마진을 포함한 현재 문서를 덮기 위해 DIV를 스타일링 할 수 있습니까?
문제
JavaScript를 사용하여 수행 할 수 있지만 CSS만으로는 DIV를 스타일링하여 페이지의 문서 컨텐츠 또는 뷰포트를 정확히 겹치도록 할 수 있습니까 (페이지에 불투명 회색 레이어를 적용하기 위해)? 페이지는 신체 요소에 대한 마진을 가질 수 있으므로 신체 요소의 너비로 DIV를 스타일링하는 것은하지 않습니다. (IE 6에서도 일해야합니다)
해결책
당신이있는 경우 <div>
이와 같이:
<div id="cover"></div>
이 스타일은 다음을 수행해야합니다.
#cover {
background-color: #ccc;
opacity: 0.6;
filter:alpha(opacity=60);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
신체에 여백이있는 페이지에서 테스트되었으며 IE 및 FF에서 저의 전체 뷰포트를 다루었습니다.
다른 팁
높이 : 문서 길이가 뷰포트 높이보다 작은 경우 100%는 뷰포트를 다루지 않습니다. 이 경우 JavaScript를 사용해야합니다.
CSS에서 JavaScript를 실행하는 IE의 능력을 사용하는 것이 속임수입니까?
width:expression(document.body.clientWidth)
제휴하지 않습니다 StackOverflow