8¸ö²»¼æÈÝIE 8µÄCSSÑùʽд·¨
Internet Explorer 8Ô¤ÉèÊÇÒÔCSS 2.1Ϊ±ê×¼£¬²¢ÐÞÕýÁËÐí¶àInternet Explorer 7µÄCSS Bug£¬ÕâÒâζ×ÅÓÐÒ»²¿·ÝÒÔÍùÒÀ¾ÝIE 7ËùÉè¼ÆµÄÍøÒ³£¬
ÔÚIE 8ÉϵijÊÏÖ»áÓÐËù³öÈ룬ËùÐÒ°ÝIE 7ÏàÈݼìÊÓ¹¦ÄÜËù´Í£¬Ä¿Ç°ÒòʹÓÃIE 8¶øµ¼Ö°æÃæ´íÎóµÄÍøÕ¾²¢²»¶à¡£
µ«Ò»ÖµÒÀÀµIE 7ÏàÈݼìÊÓ¹¦Äܲ¢·Ç³¤¾ÃÖ®¼Æ£¬¾¡Ô罫ÍøÕ¾ÐÞ¸ÄΪIE 8ÏàÈݲÅÊdz¤¾ÃÖ®¼Æ£¬ÒòΪ±Ï¾¹CSSÊdzÖÐø¸üеģ¬ÏÖÔÚ²»¸Ä£¬ÈÕºó´óÐ޵Ļú»á¾Í¸ü´ó¡£
²»ÐÒµÄÊÇ£¬Microsoft¹Ù·½²¢Î´Ìṩ¹ØÓÚIE 7¼°IE 8µÄCSS²îÒì˵Ã÷Îļþ£¬¶¥¶àÖ»ÊǸæËßÎÒÃÇIE 8Ä¿Ç°¸üÇ÷½üÓÚCSS 2.1¶ø·ÇCSS 2.0£¬Òò´Ë±ÊÕßÔÚÔì·ÃÐí¶àÍøÕ¾ºó£¬
¹æÀà³ö8¸ö×î³£¼ûµÄ²îÒ칩¶ÁÕßÃDzο¼¡£
1¡¢Æðʼ×ù標λÖÃ
ÏÈÌìÉÏ£¬IE 7ÓëIE 8ÔÚÔ¤ÉèÍøÒ³°æÃæµÄÆðʼλÖþͲ»Í¬£¬ÒÔÏÂÃæµÄ´úÂëÀ´Ëµ£¬ÔÚIE 7¼°IE 8ÉÏÆôʼµÄλÖþÍÓвîÒì¡£
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<div style="height:100px;width:200px; border: solid 1px black">
<div>
<a href="http://www.hinet.net">Hinet</a>
</div>
</div>
</body>
</html>
(IE7)
(IE8)
²»¹ýÓÉÓÚÊÇÕû¸öÆ«ÒÆ£¬¶ÔÍøÒ³µÄÓ°ÏìÏ൱С¡£
2¡¢DIVÖеÄP
ÏÂÃæµÄÖ´Ðнá¹û³ÊÏÖÁËIE 7¼°IE 8ÔÚ´¦ÀíDIVÖеÄPÖ®²îÒìÐÔ¡£
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<div style="height:100px;width:200px; border: solid 1px black">
<div>
<p>TEST Font</p>
</div>
</div>
</body>
</html>
(IE 7)
(IE
ºÜÃ÷ÏԵģ¬IE 8ÖжÔÓÚDIVÖеÄPÔ¤ÉèλÖÃÓëIE 7²»Í¬£¬IE 7Êǽ«margin-topÔ¤ÉèΪ0px£¬ÅÅÔÚ×îÉÏ·½£¬£¬IE 8ȴδԤÉèmargin-top£¬
½â¾ö·½·¨Êǽ«margin-top¼ÓÉÏ¡£
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/x
Ïà¹ØÎĵµ£º
ÔÎĵØÖ·£ºhttp://www.devwebpro.com/25-rounded-corners-techniques-with-css/
* This post is regularly updated. *
Rounded corners is one of the most popular and frequently requested
CSS techniques even the father of internet Google
also launch the rounded corners style markup
with her Google Ad ......
ÏñÉÏÃæµÄÒ»ÕÅͼƬÎÒÃǸÃÔõôÓÃjs ºÍcss + div ºÜºÃµÄÓ¦Óõ½ÎÒÃǵÄÏîÄ¿ÖÐÄØ£¿
<style>
.InpuRight{
height:20px;background:url(img/msg_bg.png) no-repeat;background-position:0px -250px;
}
.InputError{
width:20px;height:20px;background:url(img/msg_bg.png) no-repeat 0px 0px;
}
.inputLogin{
wid ......
Ϊµ¥¸ö±êÇ©¶¨Ò壺
br{
text-align: center;
color: #000000;
font-family:ËÎÌå;
}
Ϊbr±êÇ©Ö¸¶¨ÁË3¸öÑùʽÊôÐÔ£¬°üº¬¶ÔÆ䷽ʽ¡¢ÎÄ×ÖÑÕÉ«¼°×ÖÌå¡£
ÔÚÍøÒ³ÖÐÒ»¸öÿ¸öIDÖ»ÄÜʹÓÃÒ»´Î£¬È磺
<div id="main"></div>
ÔÚCSSÑùʽ±íÖУ¬IDÑ ......