Ò׽ؽØͼÈí¼þ¡¢µ¥Îļþ¡¢Ãâ°²×°¡¢´¿ÂÌÉ«¡¢½ö160KB

ÓÃCSS½â¾öÖÐÓ¢ÎÄ»ìºÏ×Ö·û´®µÄ½ØÈ¡Ê¡ÂÔÎÊÌâµÄ½â¾ö°ì·¨

×÷Ϊһ¸ö³ÌÐòÔ±£¬¾­³£ÐèÒªÃæ¶ÔµÄÒ»¸öÎÊÌâ¾ÍÊÇÔÚÐÂÎŵÈÐÅÏ¢µÄ±êÌâÁбíÖУ¬³£³£ÎªÁËÊÊÓ¦±í¸ñµÄ¿í¶È£¬ÐèÒª¶Ô¹ý³¤µÄ±êÌâÎÄ×ֵĽøÐнØÈ¡²¢ÔÚ½ØÈ¡ºóµÄÎÄ×ÖÄ©¶Ë¼ÓÉÏÊ¡ÂԺš£
ÖÚËùÖÜÖª£¬Óкܶ෽·¨¿ÉÒÔʵÏÖÕâ¸ö¹¦ÄÜ£¬JavaScript£¬ASP£¬PHP¶¼Óи÷×ÔµÄʵÏÖ·½·¨£¬µ«ÊÇÃæÁÙµÄÎÊÌâÓкܶ࣬±ÈÈçÖÐÓ¢ÎÄ»ìÔÓʱ»òÔÚijЩ±àÂëÏ£¬ÈÝÒ×Ôì³É½ØÈ¡³öÏÖÂÒÂëµÄÎÊÌ⣬ËäÈ»´ó¶àÊýÎÊÌâÒѾ­ÓбȽϳÉÊìµÄ½â¾ö·½°¸£¬µ«ÔÚÊý¾ÝÁ¿±È½Ï´óʱ£¬Ê¹ÓÃJavaScript£¬ASP£¬PHPʵÏÖÕâÒ»¹¦ÄÜ£¬ÎÞÒÉ»á¸ø¿Í»§¶Ë»ò·þÎñÆ÷¶ËÔì³É±È½Ï´óµÄ×ÊÔ´¿ªÏú¡£
Ëæ×ÅW3CµÄ½¥½¥ÆÕ¼°£¬Ðí¶àÍøÕ¾¶¼ÔÚ½øÐÐ׎«´«Í³±í¸ñת»¯ÎªDIV+CSSµÄ²¼¾Ö·½Ê½£¬ÎÒÔÚÑо¿CSSÓëDIVµÄһЩÌØÐÔʱ£¬·¢ÏÖÁËÒ»¸ö±È½ÏÓÐȤµÄCSS£¬¾­¹ýһϵÁеÄÑо¿ºÍʵÑéÒԺ󣬷¢ÏÖÁËÒ»¸öʹÓÃDIV+CSSʵÏÖÕâÒ»¹¦ÄܵÄÁíÀà·½·¨£¬´Ë·½·¨ÔÚÎÒËùÄܲâÊÔ¾ùÎÞÎÊÌ⣬²¢ÇÒÁ¼ºÃµÄ¼æÈÝÓÚ¸÷ÖÖ±àÂë¼°ÖÐÓ¢ÎÄ»ìÅŵÄÇé¿ö¡£ 
ÔÚDivÖеķ½·¨£º
<DIV STYLE="width: 200px;  border: 1px dashed red; overflow: hidden; text-overflow:ellipsis">  
<NOBR>¾ÍÊDZÈÈçÓÐÒ»ÐÐÎÄ×Ö£¬ºÜ³¤£¬±í¸ñÄÚÒ»ÐÐÏÔʾ²»ÏÂ.</NOBR>  
<NOBR>¾ÍaÊDZÈÈçÓÐÒ»ÐÐÎÄ×Ö£¬ºÜ³¤£¬±í¸ñÄÚÒ»ÐÐÏÔʾ²»ÏÂ.</NOBR>  
<NOBR>¾Í1ÊDZÈÈçÓÐÒ»ÐÐÎÄ×Ö£¬ºÜ³¤£¬±í¸ñÄÚÒ»ÐÐÏÔʾ²»ÏÂ.</NOBR>  
<NOBR>¾ÍFÊDZÈÈçÓÐÒ»ÐÐÎÄ×Ö£¬ºÜ³¤£¬±í¸ñÄÚÒ»ÐÐÏÔʾ²»ÏÂ.</NOBR>  
<NOBR>¾ÍÊÇ Like You Pig Very Very Very Much.</NOBR>  
</DIV>
ÔÚTableÖеķ½·¨£º
<TABLE style="table-layout:fixed;border-collapse:collapse;font-size:12px;" border="1" width="200" bordercolor=#666666>  
<TR>  
<TD nowrap style="overflow:hidden;text-overflow:ellipsis;">ÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝÄÚÈÝ</TD>  
</TR>  
</TABLE>
´úÂëºÜ¼òµ¥£¬»ù±¾ÉÏÓ¦¸ÃºÜÈÝÒ׾ͿÉÒÔ¿´Ã÷°×£¬Ö÷ÒªÔÚÓÚ“text-overflow”Õâ¸öÊôÐÔ£¬´ËÊôÐÔÓÐ2¸öÖµ£¬·Ö±ðÊÇ“ellipsis”ºÍ“clip”£¬¼òµ¥µÄÀí½â£¬µÚÒ»¸öÖµ»áÔÚ½ØÈ¡Ö®ºóÔÚÎÄ×ÖÄ©¶Ë¼ÓÉÏÊ¡ÂԺţ¬µÚ¶þ¸öÖµÔò²»»á¡£
Õâ¸ö·½·¨Ä¿Ç°ÎÒ»¹Ã»Óз¢ÏÖÈκÎbug£¬CSS¿ØÖÆ£¬Ò²²»»áÔì³ÉÌ«


Ïà¹ØÎĵµ£º

¸Ä±äÒ³ÃæʹÓõÄCSSÎļþ£¬Ê¹ÍøÒ³½øÐв¼¾Ö»òÉ«µ÷µÈ¸Ä±ä

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>ÎÞ±êÌâÒ³</title>
<LINK href="../css/skin1.css" mce_href="css/skin1.css" rel="stylesheet" type="text/css">
<mce:script language="JavaScript" type="text/javascript"><!--
function changeSkin(n ......

ʹÓÃCSSºÍJQueryÇáËÉÇл»ÍøÒ³ÏÔʾÑùʽ


×÷ÕߣºIIduce   À´Ô´£ºcss9   ʱ¼ä£º2009-12-21   ÔĶÁ£º601 ´Î  Ô­ÎÄÁ´½Ó   [ÊÕ²Ø]  
×î½ü²úÆ·ÖÐÐèÒª¼ÓÈë“Ò»¸öÁбíÏÔʾÑùʽ¿ìËÙÇл»”µÄ¹¦ÄÜ£¬ÕýºÃÔÚÕâƪÎÄÕÂÖп´µ½ÁËËüµÄʵÏÖ·½Ê½£¬¸Ð¾õºÜ²»´í¡£
ÕâƪÎÄÕ½²ÊöµÄÊÇÈçºÎͨ¹ýCSSºÍJQueryÀ´ÊµÏÖÔ ......

ÓÐÀûÓÚSEOµÄDIV+CSSµÄÃüÃû¹æÔòÊÕ¼¯

Ò»¡¢CSSÎļþ¼°ÑùʽÃüÃû
1¡¢CSSÎļþÃüÃû¹æ·¶
È«¾ÖÑùʽ£ºglobal.css£»
¿ò¼Ü²¼¾Ö£ºlayout.css£»
×ÖÌåÑùʽ£ºfont.css£»
Á´½ÓÑùʽ£ºlink.css£»
´òÓ¡Ñùʽ£ºprint.css£»
2¡¢CSSÑùʽÃüÃû¹æ·¶
±¾È˽¨Ò飺ÓÃ×Öĸ¡¢_ºÅ¹¤¡¢-ºÅ¡¢Êý×Ö×é³É£¬±ØÐëÒÔ×Öĸ¿ªÍ·£¬²»ÄÜΪ´¿Êý×Ö¡£ÎªÁË¿ª·¢ºóÑùʽÃû¹ÜÀí·½±ã£¬´ó¼ÒÇëÓÃÓÐÒâÒåµÄµ¥ ......

css ³¬¹ý¿í¶ÈµÄÎÄ×ÖÏÔʾµãµã

text-overflow : ellipsis;
white-space : nowrap;
overflow : hidden;
½âÊÍһϣº
text-overflow £ºellipsis; //ÈýضϵÄÎÄ×ÖÏÔʾΪµãµã¡£»¹ÓÐÒ»¸öÖµÊÇclipÒâ˼Êǽضϲ»ÏÔʾµãµã
white-space : nowrap; //ÈÃÎÄ×Ö²»»»ÐÐ
overflow : hidden; //³¬³öÒªÒþ²Ø
ÒªÏÔʾΪµãµã£¬3¸öȱһ²»¿É£¬»¹ÓУ¬³ýÁËfirefox,operaÆäËûä¯ ......

firefoxÓëIE¶ÔjavascriptºÍCSSµÄÇø±ð

1. document.formName.item("itemName") ÎÊÌâ
˵Ã÷:IEÏÂ,¿ÉÒÔʹÓÃdocument.formName.item("itemName")»òdocument.formName.elements["elementName"];
FirefoxÏÂ,Ö»ÄÜʹÓÃdocument.formName.elements["elementName"].
½â¾ö·½·¨:ͳһʹÓÃdocument.formName.elements["elementName"].
2.¼¯ºÏÀà¶ÔÏóÎÊÌâ
˵Ã÷:IEÏÂ,¿É ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØͼ | ¸ÓICP±¸09004571ºÅ