CSS控制LI行字符溢出用省略號(hào)代替_層和布局特效

用CSS去控制一行LI字符寬度溢出行的寬度，然后用省略號(hào)代替，全面兼容各種瀏覽器。這樣的布局會(huì)使頁(yè)面看上去更美觀、整齊，讓你舒服一點(diǎn)。

<!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" mrc="text/html; charset=utf-8" />
<title>CSS控制一行字符溢出用省略號(hào)代替</title>
<style>
* { margin: 0; padding: 0; }
a { text-decoration: none; color: #000; }
a:hover { text-decoration: none; color: #000; }
ul {width: 280px;height:126px; margin: 38px auto;padding: 12px 6px 12px 22px;border: 1px solid #CCC;background: #EEE;}
li { margin: 12px 0; }
li a {display: block;width: 168px;overflow: hidden;/*不能寫(xiě)在最后*/white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis;}
/* firefox only */
li:not(p) {clear: both;}
li:not(p) a {max-width: 172px;float: left;}
li:not(p):after {mrc: "...";float: left;width: 25px;padding-left: 5px;color: #000;}
</style>
</head>

<body>
<ul>
<li><a href="/soft/3149.shtml" target="_blank">Windows風(fēng)格的日歷控件VB專(zhuān)用版</a></li><li><a href="/soft/3148.shtml" target="_blank">利用USB設(shè)備鎖定計(jì)算機(jī)的VB程序</a></li><li><a href="/soft/3147.shtml" target="_blank">漂亮可換膚的VB鬧鐘程序</a></li><li><a href="/soft/3144.shtml" target="_blank">ASP+Ajax無(wú)刷新投票程序演示</a></li>
</ul>
</body>
</html>

所屬頻道：層和布局特效/更新時(shí)間：2012-12-19

[收藏][報(bào)錯(cuò)][返回列表]

相關(guān)層和布局特效：

層和布局特效Rss訂閱特效代碼搜索

層和布局特效推薦

猜你也喜歡看這些

相關(guān)鏈接：
復(fù)制本頁(yè)鏈接| 搜索CSS控制LI行字符溢出用省略號(hào)代替
特效說(shuō)明：
層和布局模板-CSS控制LI行字符溢出用省略號(hào)代替。

日韩天天综合网_野战两个奶头被亲到高潮_亚洲日韩欧美精品综合_av女人天堂污污污_视频一区**字幕无弹窗_国产亚洲欧美小视频_国内性爱精品在线免费视频_国产一级电影在线播放_日韩欧美内地福利_亚洲一二三不卡片区

CSS控制LI行字符溢出用省略號(hào)代替_層和布局特效

層和布局特效Rss訂閱特效代碼搜索

層和布局特效推薦

猜你也喜歡看這些