divçæ ·å¼ä¸ä½¿ç¨ç¸å½äºæµè§å¨çªå£å®ä½ââposition:fixedã
ä¸ãposition:fixedå±æ§çå«ä¹
fixedï¼çæç»å¯¹å®ä½çå
ç´ ï¼ç¸å¯¹äºæµè§å¨çªå£è¿è¡å®ä½ãå
ç´ çä½ç½®éè¿ "left", "top", "right" 以å "bottom" å±æ§è¿è¡è§å®ã
æ们平æ¶æ说çåºå®å®ä½æçå°±æ¯fixedï¼è®¾ç½®äºåºå®å®ä½çå
ç´ ä¸ä¼éæ»å¨æ¡ä¸ä¸æ»å¨ã
äºãä¸è¬ç position:fixed; å®ç°æ¹æ³
#top{position:fixed;bottom:0;right:20px}
å®ç°äºid为topçå
ç´ åºå®å¨æµè§å¨çåºé¨åè·ç¦»å³è¾¹20个åç´ çä½ç½®
#top{position:fixed;top:20px;right:20px}
å®ç°äºid为topçå
ç´ åºå®å¨è·ç¦»æµè§å¨ç顶é¨20个åç´ åè·ç¦»å³è¾¹20个åç´ çä½ç½®
ä¸ãIE6ä¸position:fixed; å®ç°æ¹æ³
å¨IE6ä¸æ¯ä¸è½ç´æ¥ä½¿ç¨ position:fixed; ãä½ éè¦ä¸äº CSS Hack æ¥è§£å³å®
ç¸åçè¿æ¯è®© <div id="top">...</div> å
ç´ åºå®å¨æµè§å¨çåºé¨åè·ç¦»å³è¾¹ç20个åç´ ï¼è¿æ¬¡ç代ç æ¯ï¼#top{
position:fixed;
bottom:0;
right:20px;
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
}
right è· left å±æ§å¯ä»¥ç¨ç»å¯¹å®ä½çåæ³è§£å³ï¼è top è· bottom å°±éè¦ç¨ä¸é¢ç
表达å¼æ¥å®ç°ãå
¶ä¸å¨_position:absolute; ä¸ç _ 符å·åªæ IE6 æè½è¯å«ï¼ç®çæ¯ä¸ºäºåºåå
¶ä»æµè§å¨
1ã使å
ç´ åºå®å¨æµè§å¨çªå£ç顶é¨ï¼
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop));
}
2ã使å
ç´ åºå®è·æµè§å¨çªå£ç顶é¨aåç´ çä½ç½®ï¼
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop));
_margin-top:a;
}æè
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+a));
}
3ã使å
ç´ åºå®å¨æµè§å¨çªå£çåºé¨ï¼
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
}
4ã使å
ç´ åºå®å¨è·æµè§å¨çªå£çåºé¨båç´ çä½ç½®ï¼
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
_margin-bottom:b;
}æè
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||b)-(parseInt(this.currentStyle.marginBottom,10)||b)));
}
åãIE6ä¸çéªå¨é®é¢
é®é¢è¿æ²¡æå®å
¨è§£å³ãå¨ç¨äºä¸é¢çåæ³åï¼ä½ ä¼åç°ï¼è¢«åºå®å®ä½çå
ç´ å¨æ»å¨æ»å¨æ¡çæ¶åä¼éªå¨ã解å³éªå¨é®é¢çåæ³æ¯å¨ CSS æ件ä¸å å
¥ï¼
*html{background-image:url(
about:blank);background-attachment:fixed;}
å
¶ä¸ * htmléæ©å¨hackæ¯ç» IE6 è¯å«çã
å°æ¤ï¼IE6 ç position:fixed; é®é¢å·²ç»è¢«è§£å³äº