css×Ô¶¯»»ÐÐ(ת)
Á¬ÐøµÄÓ¢ÎÄ»òÊý×ÖÄÜÊÇÈÝÆ÷±»³Å´ó£¬²»Äܸù¾ÝÈÝÆ÷µÄ´óС×Ô¶¯»»ÐУ¬¶ÔÓÚDivºÍtableÒÔ¼°²»Í¬µÄä¯ÀÀÆ÷£¬ÊµÏÖcss×Ô¶¯»»Ðеķ½·¨¶¼ÉÔÓв»Í¬£¬ÏÂÃæ·Ö±ð½éÉÜ£º
¶ÔÓÚdiv
¡¡¡¡1.£¨IEä¯ÀÀÆ÷£©white-space:normal; word-break:break-all;ÕâÀïǰÕßÊÇ×ñѱê×¼¡£
ÒÔÏÂÊÇÒýÓÃÆ¬¶Î£º
#wrap{white-space:normal; width:200px; }
»òÕß
#wrap{word-break:break-all;width:200px;}
<div id="wrap">ddd111111111111111111111111111111</div>
¡¡¡¡Ð§¹û£º¿ÉÒÔʵÏÖ×Ô¶¯»»ÐÐ
¡¡¡¡2.£¨Firefoxä¯ÀÀÆ÷£©white-space:normal; word-break:break-all;overflow:hidden;ͬÑùµÄFFÏÂҲûÓкܺõÄʵÏÖ·½·¨£¬Ö»ÄÜÒþ²Ø»òÕß¼Ó¹ö¶¯Ìõ£¬µ±È»²»¼Ó¹ö¶¯ÌõЧ¹û¸üºÃ£¡
ÒÔÏÂÊÇÒýÓÃÆ¬¶Î£º
#wrap{white-space:normal; width:200px; overflow:auto;}
»òÕß
#wrap{word-break:break-all;width:200px; overflow:auto; }
<div id="wrap">ddd1111111111111111111111111111111111111111</div>
¡¡¡¡Ð§¹û£ºÈÝÆ÷Õý³££¬ÄÚÈÝÒþ²Ø
¶ÔÓÚtable
¡¡¡¡1. (IEä¯ÀÀÆ÷)ʹÓÃÑùʽtable-layout:fixed£»
ÒÔÏÂÊÇÒýÓÃÆ¬¶Î£º
<style>
.tb{table-layout:fixed}
</style>
<table class="tbl" width="80">
<tr><td>
abcdefghigklmnopqrstuvwxyz 1234567890
</td></tr>
</table>
¡¡¡¡Ð§¹û£º¿ÉÒÔ×Ô¶¯»»ÐÐ
¡¡¡¡2.(IEä¯ÀÀÆ÷)ʹÓÃÑùʽ
ÒÔÏÂÊÇÒýÓÃÆ¬¶Î£º
<style>
.tb {table-layout:fixed}
</style>
<table class="tb" width="80"><tr><td nowrap>
abcdefghigklmnopqrstuvwxyz 1234567890
</td></tr>
</table>
¡¡¡¡Ð§¹û£º¿ÉÒÔ×Ô¶¯»»ÐÐ
¡¡¡¡3. (IEä¯ÀÀÆ÷)ÔÚʹÓðٷֱȹ̶¨td´óСÇé¿öÏÂʹÓÃÑùʽtable-layout:fixedÓënowrap
ÒÔÏÂÊÇÒýÓÃÆ¬¶Î£º
<style>
.tb{table-layout:fixed}
</style>
<table class="tb" width=80>
<tr>
<td width=25% nowrap>
abcdefghigklmnopqrstuvwxyz 1234567890
</td>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890</td>
</tr>
</table>
¡¡¡¡Ð§¹û£ºÁ½¸ötd¾ùÕý³£×Ô¶¯»»ÐÐ
¡¡¡¡4.(Firefoxä¯ÀÀÆ÷)ÔÚʹÓðٷֱȹ̶¨td´óСÇé¿öÏÂʹÓÃÑùʽtable-layout:fixedÓënowrap,²¢ÇÒÊ
Ïà¹ØÎĵµ£º
<asp:GridView ID="GridView1" runat="server" Width="100%"
HorizontalAlign="Center" CellPadding="1" AutoGenerateColumns="False" AllowPaging="true" ......
1¡¢IE·Ö²»Çå¼Ì³Ð¹ØÏµºÍ¸¸×Ó¹ØÏµµÄ²î±ð£¬È«²¿¶¼ÊǼ̳йØÏµ¡£
2¡¢ÔÚ¸øÄãµÄ±êÇ©·è¿ñ¼ÓÑ¡Ôñ·ûµÄʱºò£¬±ðÍüÁËÔÚCSSÀï¸øÑ¡Ôñ·û¼ÓÉÏ×¢ÊÍ¡£µÈÄãÒÔºóÐÞ¸ÄÄãµÄCSSµÄʱºò¾ÍÖªµÀΪʲôҪÕâô×öÁË¡£ÁíÍâÌáÐÑÄú£¬²»ÒªÌ«·è¿ñÁË¡£
3¡¢Èç¹ûÄã¸øÒ»¸ö±êÇ©ÉèÖÃÁËÒ»¸öÉîÉ«µ÷µÄ±³¾°Í¼Æ¬ºÍÁÁÉ«µ÷µÄÎÄ×ÖЧ¹û¡£½¨ÒéÕâ¸öʱºò¸øÄãµÄ±êÇ©ÔÙÉèÖÃÒ»¸öÉî ......
IE6ʵÏÖ·½·¨:
HTML²¿·Ö:
<imgsrc="..."alt="..."onload="resizeImage(this)"/>
JS²¿·Ö:
<mce:scripttype="text/javascript"><!--
functionresizeImage(obj){
obj.width=obj.width>50&&obj.width>obj.height?50:auto;
obj.height=obj.height>50?50:auto;
}
// -->&l ......
ËÑË÷ÒýÇæÓÅ»¯(seo)Óкܶ๤×÷Òª×ö£¬ÆäÖжԴúÂëµÄÓÅ»¯ÊÇÒ»¸öºÜ¹Ø¼üµÄ²½Öè¡£
ΪÁ˸ü¼Ó·ûºÏSEOµÄ¹æ·¶£¬ÏÂÃæÊÇĿǰÁ÷ÐеÄCSS+DIVµÄÃüÃû¹æÔò£º
ҳͷ:header
µÇ¼Ìõ:loginBar
±êÖ¾:logo
²àÀ¸:sideBar
¹ã¸æ:banner
µ¼º½:nav
×Óµ¼º½:subNav
²Ëµ¥:menu
×Ӳ˵¥:subMenu
ËÑË÷:search
¹ö¶¯:scroll
Ò³ÃæÖ÷Ìå:main
ÄÚÈÝ:con ......
²âÊÔ»·¾³£ºIE6 , IE7, IE8, FF3.0
±í´ï·½Ê½£º±í´ï·½Ê½£º
body { `background:red }
body { ~background:red }
body { !background:red }
body { @background:red }
body { #background:red }
body { $background:red }
body { %background:red }
body { ^b ......