Óà CSS ʵÏÖÎı¾¹ý³¤Ê±£¬Ê¡ÂԺš°¡¡¡±ÏÔʾЧ¹û¡£
Html´úÂë
view plaincopy to clipboardprint?
<div style="width: 230px; border: 1px solid blue; overflow: hidden; text-overflow:ellipsis">
<nobr>¾ÍÊDZÈÈçÓÐÒ»ÐÐÎÄ×Ö£¬ºÜ³¤£¬±í¸ñÄÚÒ»ÐÐÏÔʾ²»ÏÂ.</nobr>
<nobr>ÕâÊDz»¸Ã»»ÐеÄÎı¾,ÕâÊÇÒ»Ðв»¸Ã»»ÐеÄÎı¾ ,ÕâÊÇÎı¾ÐеĽáβ¡£</nobr>
</div>
<div style="width: 230px; border: 1px solid blue; overflow: hidden; text-overflow:ellipsis">
<nobr>¾ÍÊDZÈÈçÓÐÒ»ÐÐÎÄ×Ö£¬ºÜ³¤£¬±í¸ñÄÚÒ»ÐÐÏÔʾ²»ÏÂ.</nobr>
<nobr>ÕâÊDz»¸Ã»»ÐеÄÎı¾,ÕâÊÇÒ»Ðв»¸Ã»»ÐеÄÎı¾ ,ÕâÊÇÎı¾ÐеĽáβ¡£</nobr>
</div>
½âÊÍ£º<nobr></nobr>±êÇ©Óë<br/>±êÇ©¶ÔÁ¢£¬±íʾ²»»»ÐУ¬ÕâÀï×îÇ¿µÄÊÇtext-overflow:ellipsis£»À´¿´Ò»CSSÖжÔÕâÒ»ÊôÐԵĽâÊÍ£º
Óï·¨£º
¡¡¡¡text-overflow : clip | ellipsis
¡¡¡¡²ÎÊý£º
¡¡¡¡clip : ¡¡²»ÏÔʾʡÂÔ±ê¼Ç£¨...£©£¬¶øÊǼòµ¥µÄ²ÃÇÐ
¡¡¡¡£¨clipÕâ¸ö²ÎÊýÊDz»³£Óõģ¡£©
¡¡¡¡ellipsis : ¡¡µ±¶ÔÏóÄÚÎı¾Òç³öʱÏÔʾʡÂÔ±ê¼Ç£¨...£©
¡¡¡¡ËµÃ÷£º
¡¡¡¡ÉèÖûò¼ìË÷ÊÇ·ñʹÓÃÒ»¸öÊ¡ÂÔ±ê¼Ç£¨...£©±êʾ¶ÔÏóÄÚÎı¾µÄÒç³ö¡£
¡¡¡¡×î´óµÄȱµã£ºtext-overflow:ellipsisÊôÐÔÔÚFFÖÐÊÇûÓÐЧ¹ûµÄ¡£
×¢Ò⣺
Ò»¡¢½ö¶¨Òåtext-overflow:ellipsis; ²»ÄÜʵÏÖÊ¡ÂÔºÅЧ¹û¡£
¶þ¡¢¶¨Òåtext-overflow:ellipsis; white-space:nowrap; ͬÑù²»ÄÜʵÏÖÊ¡ÂÔºÅЧ¹û¡£
Èý¡¢Í¬Ê±Ó¦Ó㺠text-overflow:ellipsis; white-space:nowrap; overflow:hidden; ʵÏÖÁËËùÏëÒªµÃµ½µÄÒç³öÎı¾ÏÔʾʡÂÔºÅЧ¹û£º
ÇëÄú·Ç·²×¢ÖØ£¬text-overflow:ellipsisÊôÐÔÔÚFFÖÐÊÇûÓÐЧ¹ûµÄ¡££¨Y_Y£©
ÔÎÄ£ºhttp://zzx0421.javaeye.com/blog/450958
Ïà¹ØÎĵµ£º
1.Ò»¸öºÜºÃµÄAppfuseѧϰÂÛ̳:http://n4.nabble.com/AppFuse-f547863.html
2.Appfuse CSSµÄ¿ª·¢https://appfuse-css.dev.java.net/
3.CSSÑùʽµÄ²é¿´£¬CSS Framework Themes: http://css.appfuse.org/themes/
4.CSS ÑùʽµÄÏÂÔØhttp://issues.appfuse.org/browse/CSS-13
¸öÈ˸оõ±È½ÏºÃµÄÁ½¸öCSS style
http://css.appfu ......
ÓÉÓÚä¯ÀÀÆ÷°æ±¾µÄ²»Í¬£¬¶ÔCSSÀïÄ³Ð©ÔªËØµÄ½âÊÍÒ²²»Ò»Ñù£¬²Å×Óµ±È»Ò²Åöµ½Í¬ÑùµÄÎÊÌ⣬ҲÊÕ¼¯ÁËһЩ½â¾ö·½·¨£¬²Å×Ó֮ǰÌù¹ýÁ½¸öÕë¶Ôä¯ÀÀÆ÷°æ±¾²»Í¬¶øÑ¡Ôñ²»Í¬CSSµÄ´úÂ룬ÓÐÐËȤµÄÅóÓÑ×Ô¼ºÕÒÕÒ°É¡£
ÆäʵÎÒÃÇ»¹¿ÉÒÔÀûÓÃÌõ¼þ×¢Ê͵ķ½·¨À´´ïµ½ÀàËÆµÄÄ¿µÄ£¬Ê²Ã´ÊÇÌõ¼þ×¢ÊÍ£¬²Å×ÓÒ²Ôڴ˼òµ¥½éÉÜһϣ¬Î޷ǾÍÊÇһЩifÅжÏÀ²£¬ºÇºÇ£¬ ......
HTMLÖÐA±êÇ©±»µã»÷ºó£¬Æä»ñµÃÁ˽¹µã£¬ÔÚÆäÖÜΧ»áÓпɶñµÄÐéÏß¿ò£»ÓÐʱÎÒÃDz»ÏëÈÃÓû§·¢ÏÖ£¬Ê¹ÓÃÒÔÏÂcss´úÂë¼´¿ÉÏû³ý¡£
/*ΪÁËÏû³ýÑ¡ÖÐʱµÄÐéÏß¿ò*/
a
{
bblr:expression(this.onFocus=this.blur());/*IEʹÓÃ*/
outline-style:none;/*FFʹÓÃ*/
}
......
ÔÚtableÖпØÖƵ¥Ôª¸ñÖ®¼äµÄ¼ä¾àÒªÓõ½cellspacing¡¢cellpadding£¬Ä¬ÈÏÇé¿öcellspacing¡¢cellpadding¾ù²»Îª0£¬µ«¾³£µÄ×´¿öΪÁ˲»ÈÃtableµ¥Ôª¸ñÖ®¼äµÄ¼ä¾àÓ°Ïìµ½ÃÀ¹Û£¬ÎÒÃǾ³£»á°Ñcellspacing¡¢cellpaddingÉèÖÃΪ0£¬Òò´Ë¾³£¿´µ½“<table cellspacing=0 cellpadding=0>”ÕâÑùµÄ´úÂë¡£ÕâÑù×öÎÞÐÎÖÐÔö¼ÓÁË´ú ......
1.»ù±¾Óï·¨
¡¡¡¡
¡¡¡¡CSSµÄ¶¨ÒåÊÇÓÉÈý¸ö²¿·Ö¹¹³É£ºÑ¡Ôñ·û£¨selector£©£¬ÊôÐÔ£¨properties£©ºÍÊôÐÔµÄȡֵ£¨value£©¡£
¡¡¡¡»ù±¾¸ñʽÈçÏ£º
¡¡¡¡selector { property: value}
¡¡¡¡£¨Ñ¡Ôñ·û { ÊôÐÔ£ºÖµ}£©
¡¡¡¡Ñ¡Ôñ·ûÊÇ¿ÉÒÔÊǶàÖÖÐÎʽ£¬Ò»°ãÊÇÄãÒª¶¨ÒåÑùʽµÄHTML±ê¼Ç£¬ÀýÈçBODY¡¢P¡¢TABLE……£¬Äã¿ÉÒÔÍ ......