2015-02-07 4 views
0

바보 같은 질문에 사과드립니다. 그러나 콘텐츠 영역이 얼마나 많은 콘텐츠와 관계없이 콘텐츠 창을 브라우저 창 전체 높이에 어떻게 만들 수 있습니까? 즉, 일부 페이지는 브라우저 창의 전체 영역을 차지할 수 있습니다 (위대합니다).하지만 다른 페이지는 소량의 내용을 담고 창 하단까지 완전히 밀어 넣을만큼 충분하지 않습니다.CSS 콘텐츠 영역 전체 높이 + 배경 이미지 만들기

본질적으로 내용의 양에 관계없이 페이지 맨 아래까지 모든 방향으로 진행되는 그라데이션 그림자를 콘텐츠 영역의 왼쪽과 오른쪽에 적용하려고합니다. 작은 화면 (예 : 바탕 화면에만 표시되고 모바일에는 표시되지 않는 경우)이있는 경우 그림자가 사라지도록 CSS 미디어 쿼리를 적용하려고합니다.

또한 일부 페이지는 헤더를 가질 수 있고 다른 페이지는 헤더를 가질 수 없습니다. 바닥 글에도 동일하게 적용되며 마침내 일부 페이지에는 머리말이나 꼬리말이 없으므로 그라디언트의 높이가 모든 상황에 맞아야하지만 모든 경우에 항상 내용 영역이 있습니다.

몇 가지 조언이 도움이 될 것입니다.

예 1 : 여기

내가 찾고 있어요 몇 가지 예입니다 머리글과 바닥 글 Example 1: with Header and Footer 예 2 : 만 Example 2: with Footer only 예 3 바닥 글과 함께 : 헤더 만 enter image description here 예 4 : 아니오 머리글과 바닥 글 enter image description here

+0

피들 : http://jsfiddle.net/upkrce5p/ – JaXL

답변

1

시도 :

#any_content{ 
    height: auto; 
    min-height: 100%; 
} 

콘텐츠 영역의 최소 높이를 설정합니다.

+0

시도해 보았지만 작동하지 않았습니다 .--( – JaXL

+0

HTML 소스를 보여주세요. (+ CSS). – begoyan