DIV+CSSÉè¼ÆÊ±ä¯ÀÀÆ÷¼æÈÝÐÔÎÊÌâ
ÔÚÕâÖÖä¯ÀÀÆ÷ÏÂÏÔʾÕý³££¬ÔÚÁíÒ»ÖÖϾÍÂÒÁË£¬ÎÒÃÇÔÚ±àдCSSµÄʱºò»áºÜÄջ𣬸ÕÐÞ¸´ÁËÕâ¸öä¯ÀÀÆ÷µÄÎÊÌ⣬½á¹ûÁíÍâÒ»¸öä¯ÀÀÆ÷È´³öÁËÐÂÎÊÌâ¡£
-
ʲôÊÇä¯ÀÀÆ÷¼æÈÝ£ºµ±ÎÒÃÇʹÓò»Í¬µÄä¯ÀÀÆ÷£¨Firefox IE7
IE6£©·ÃÎÊͬһ¸öÍøÕ¾£¬»òÕßÒ³ÃæµÄʱºò£¬»á³öÏÖһЩ²»¼æÈݵÄÎÊÌ⣬ÔÚÕâÖÖä¯ÀÀÆ÷ÏÂÏÔʾÕý³££¬ÔÚÁíÒ»ÖÖϾÍÂÒÁË£¬ÎÒÃÇÔÚ±àдCSSµÄʱºò»áºÜÄջ𣬸ÕÐÞ¸´
ÁËÕâ¸öä¯ÀÀÆ÷µÄÎÊÌ⣬½á¹ûÁíÍâÒ»¸öä¯ÀÀÆ÷È´³öÁËÐÂÎÊÌâ¡£ºÃ°É£¬ÎÒ·þÁËÐаɣ¬ÄÇÎÒ¾ÍÀûÓÃÄãÃǵIJ»¼æÈݸ÷дһ¶Îcss,ÈÃËûÃǸ÷Ö´Ðи÷µÄ£¬ºÇºÇ¡£
Ò»¡¢!important (¹¦ÄÜÓÐÏÞ)
Ëæ×ÅIE7¶Ô!importantµÄÖ§³Ö, !important ·½·¨ÏÖÔÚÖ»Õë¶ÔIE6µÄ¼æÈÝ.(×¢Òâд·¨.¼ÇµÃ¸ÃÉùÃ÷λÖÃÐèÒªÌáǰ.)
ÀýÈç:
#example {
width: 100px !important; /* IE7+FF */
width: 200px; /* IE6 */
}
¶þ¡¢CSS HACKµÄ·½·¨(ÐÂÊÖ¿ÉÒÔ¿´¿´£¬¸ßÊ־͵±Â·¹ý°É)
Ê×ÏÈÐèÒªÖªµÀµÄÊÇ£º
ËùÓÐä¯ÀÀÆ÷ ͨÓà height: 100px;
IE6 רÓà _height: 100px;
IE7 רÓà *+height: 100px;
IE6¡¢IE7 ¹²ÓÃ *height: 100px;
IE7¡¢FF ¹²ÓÃ height: 100px !important;
ÀýÈ磺
#example { height:100px; } /* FF */
* html #example { height:200px; } /* IE6 */
*+html #example { height:300px; } /* IE7 */
ÏÂÃæµÄÕâÖÖ·½·¨±È½Ï¼òµ¥
¾Ù¼¸¸öÀý×Ó£º
1¡¢IE6 - IE7+FF
#example {
height:100px; /* FF+IE7 */
_height:200px; /* IE6 */
}
ÆäʵÕâ¸öÓÃÉÏÃæËµµÄµÚÒ»ÖÖ·½·¨Ò²¿ÉÒÔ
#example {
height:100px !important; /* FF+IE7 */
height:200px; /* IE6 */
}
2¡¢IE6+IE7 - FF
#example {
height:100px; /* FF */
*height:200px; /* IE6+IE7 */
}
3¡¢IE6+FF - IE7
#example {
height:100px; /* IE6+FF */
*+height:200px; /* IE7 */
}
4¡¢IE6 IE7 FF ¸÷²»Ïàͬ
#example {
height:100px; /* FF */
_height:200px; /* IE6 */
*+height:300px; /* IE7 */
}
»ò£º
#example {
height:100px; /* FF */
*height:300px; /* IE7 */
_heigh
Ïà¹ØÎĵµ£º
ÔÚ½øÐÐdiv+cssÍøÒ³²¼¾ÖµÄʱºò£¬²»¿É±ÜÃâµÄÐèÒª²åÈëÒ»¶¨µÄ±íµ¥ÔªËØ£¬inputÊÇÆäÖÐ×î³£¼ûµÄÒ»ÖÖ¡£ÎÒÃÇÔÚ²¼¾ÖÖУ¬³£»áÓöµ½Îı¾ÊäÈë¿òÓëͬ´¦Ò»ÐеÄÎı¾²»¶ÔÆëµÄÎÊÌâ¡£Õâ¸öÎÊÌâÉèÖÃinputµÄvertical-align:middleÊôÐÔÀ´½â¾ö¡£
ÎÒÃÇÀ´¿´ÏÂÃæµÄÀý×Ó£¬ÈçºÎ½â¾öÎı¾ÊäÈë¿òÓëÎı¾¶ÔÆëµÄÎÊÌ⣡
<!DOCTYPE html PUBLIC "-//W3C//DTD ......
¾²Ì¬¶¨Î»£ºposition:static£¨ÎªpositionÊôÐÔµÄĬÈÏÖµ£©¡£
¶¯Ì¬¶¨Î»£ºposition:relative»òposition:absolute»òposition:fixed¡£
×æÔªËØ£ºÈÎÒâ°üº¬¸ÃÔªËØµÄÔªËØ¡£ ¸¸ÔªËØ£ºÖ±½Ó°üº¬¸ÃÔªËØµÄ×æÔªËØ¡£ ͬ±²ÔªËØ£ºÓµÓй²Í¬µÄ¸¸ÔªËصÄÔªËØ¡£
×¢£ºÕâЩ¸Å
ÄîΪ×÷Õß ......
×Ô¼º×ܽáµÄÐĵãº
1£ºÔÚcssÉè¼ÆÖУ¬µ±Í¼Æ¬²»¹»¿íʱ£¬Õâʱ¿ÉÒÔ¿¼ÂÇʹÓñ³¾°ÑÕÉ«£¨Óë¸ÃͼƬÏàËÆµÄÑÕÉ«£©À´²¹³ä¡£
2£¬ÔÚcssÉè¼ÆÖУ¬¿ÉÒÔʹÓÃͼƬµÄ±³¾°É«ÏòÍøÒ³µÄ±³¾°É«¹ý¶É
Èçͼ£º
¾ßÌå²ÎÕÕ¡¶¾«Í¨JavaScript+Jquery¡·3-20.html ......
ÓÉÓÚ¸÷ä¯ÀÀÆ÷µÄĬÈÏCSSÑùʽ²»Ò»Ñù£¬ÎÒÃDZØÐëдһ¸öCSS ResetͳһÆðÀ´¡£
ͨ³£ÎÒµÄ×ö·¨ÊÇÔÚcommon.cssÀïдȫ¾Ö¿ØÖÆ£¬ÕâÀïÃæÒ²°üÀ¨headerºÍfooter£¬ÆäËüCSSÎļþ¾Íͨ¹ý@import url(”common.css”);ÒýÓá£
body{padding:10px;margin:0;background:#fff;font-size:12px;line-height:14px;color:#333;font-family:Ari ......
ºÜÔç¾ÍÔÚÕâÀï¿´µ½¹ý½â¾ö·½°¸£¬Óëà»à»ÌÖÂÛºó·¢ÏÖÕâ¸ö·½°¸»¹ÊǺܿɿ¿µÄ¡£µ±È»£¬Î¨Ò»µÄȱµã¾ÍÊÇÿһ¸öÊôÐÔ¶¼ÒªÈ¥Hack£¬µ«ÎÒÔںܶàʵ¼ùÖУ¬Ö»ÓÑÐÞÕý’1-2¸öÊôÐԾͿÉÒÔÁË¡£
¾ßÌåд·¨ºÜÈÝÒ×£º
#someNode
{
position: fixed;
#position: fixed;
_position: fixed;
}
µÚһşøFirefoxÒÔ¼°ÆäËûä¯ÀÀÆ ......