CSS 实现隐藏 li 内容超出宽度部分，通过设置 LI 行的宽度，溢出部分隐藏比大多数采用的规定显示文字的字节数的方式更为有效，后者在中英文混合标题中将会零乱不堪。测试例子代码如下， 大家可以另存为html文件自行运行测试。
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>CSS隐藏li标签超出宽度部分</title> <style type="text/css"> <!-- div { width:200px; border:1px solid #ccc; padding:12px; } li { font-size:14px; align:left; width:183px; margin-bottom:5px; white-space:nowrap; text-overflow:ellipsis; overflow: hidden; } --> </style> </head> <body> <ul> <div> <li><a href="# " _fcksavedurl="# " >CSS隐藏行超出宽度部分</a></li> <li><a href="# " _fcksavedurl="# " >CSS隐藏li标签行超出宽度部分</a></li> <li><a href="# " _fcksavedurl="# " >CSS隐藏li标签行超出宽度</a></li> <li><a href="# " _fcksavedurl="# " >CSS隐藏li标签行超出宽度部分</a></li> <li><a href="# " _fcksavedurl="# " >CSS隐藏超出宽度部分</a></li> <li><a href="# " _fcksavedurl="# " >CSS隐藏li标签行超出宽度部分</a></li> <li><a href="# " _fcksavedurl="# " >CSS隐藏li标签行超出宽度</a></li> <li><a href="# " _fcksavedurl="# " >CSS隐藏li标签行超出宽度部分</a></li> </div></ul> </body> </html>
标签：网站建设
↑上一篇：史上最全的色彩标准卡及配色方案
↓下一篇：关于事业和回报
