2010-06-30 3 views
3

Firefox와 Webkit 브라우저에 대해서만 걱정한다면, 다음 CSS 태그에서 꼬리말을 페이지 하단에 붙이기 위해 어떤 CSS를 사용합니까? 참고 : 페이지에 마크 업을 추가하고 싶지 않습니다. 0에 고정하고 바닥을 설정 한불필요한 마크 업없이 페이지 하단에 꼬리말을 붙이기

<html> 
    <body> 
     <header>...</header> 
     <article>...</article> 
     <aside>...</aside> 
     <footer>...</footer> 
    </body> 
</html> 

답변

6

그냥 위치를 설정 :

footer 
{ 
    position:fixed; 
    bottom:0; 
} 

나를 위해 등 FF, IE7, IE8에서 치료를 작동합니다. 여기에 바닥 글에 대한 내 사이트 중 하나에 내 실제 CSS (아이디 footer와 사업부는)입니다 :

#footer 
{ 
clear:both; 
color:#FFF; 
background:#666; 
bottom:0; 
border:solid 1px #333; 
height:30px; 
width:100%; 
min-width:950px; 
position:fixed; 
z-index:100; 
} 
+1

스크롤되는 내용의 마지막 30px는 어떻게 보입니까? 내용물이 아닌 한 여백이나 패딩 또는 다른 어떤 것이 든 그 바닥에 적어도 30px의 빈 공간이 있어야합니다. – FelipeAls

+0

@ 펠리페 - 나는 이미 그렇게했지만, 각주에 감사드립니다. – GenericTypeTea

1

처럼 position:fixed

당신이 뭔가를 할 수 사용해보십시오 :

footer { position:fixed; bottom:0; } 

그것은 가치 <footer> 태그를 사용하고 있기 때문에 #footer가 바닥 글 요소가 아닌 'footer'라는 ID를 가진 요소를 참조하고 있으므로 CSS에 'footer'앞에 #를 넣으면 안됩니다.

0

div#footer { position:fixed; bottom:0; }은가는 길입니다.

관련 문제