JavaScript가 없으면 마진을 포함한 현재 문서를 덮기 위해 DIV를 스타일링 할 수 있습니까?

StackOverflow https://stackoverflow.com/questions/870237

  •  22-08-2019
  •  | 
  •  

문제

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)
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top