设为首页  
联系我们  
加入收藏  
网页制作 冲浪宝典 图形图像 操作系统 软件教学 编程开发 认证考试 安全技术 站长专区 文学驿站 娱乐天地 游戏天地 办公软件
文章搜索
您的位置: 首页 >> 文章首页 >> 网页制作 >> 心得技巧 >> LI标签中内容超过长度后以省略号显示的方法
精品推荐
心得技巧点击TOP10
·如何做才能成为一名优秀的网页设计师
·初学者入门:如何学习网页制作?
·网页屏蔽(左右键,代码等)的非JS方法
·javascript控制cookies及在跳出本页给出提示,是否放弃操作!
·入门:PHP编程“数组”的基础知识
·li标签的间距问题 - 兼谈书写li的最佳方式
·网站页面的均衡规划与选择
·Google Maps API 简易使用文件
·Q-Zone空间实用代码三例
·DIV CSS打造背景图片超级翻转网页导航菜单
网页制作点击TOP10
·菜鸟架设动网论坛全教程
·网页模板的使用方法 (教程)
·常用CSS大全
·网页对联广告代码效果大全
·用Dreamweaver简单描述制作网页的基本步骤
·javascript技巧--如何制作移动的浮动层
·用HTML页面中的javascript函数控制Flash动画播放
·天极网软件频道的用JS实现的图片切换特效
·网页初学者的参考:HTML标记手册
·用JavaScript实现文件图片滚动效果
精选专题

LI标签中内容超过长度后以省略号显示的方法

作者: 来源:http://www.xgdown.com/ 时间:2007-8-4 9:18:51

在使用DIV+CSS技巧">CSS网页标准制作网页时,LI标签中内容超过长度后以省略号显示的方法。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
<!--
li {
 width:200px;
 white-space:nowrap;
 text-overflow:ellipsis;
 -o-text-overflow:ellipsis;
 overflow: hidden;
 } 
/* firefox only */
  li:not(p) { /* wtf is? pls let me know*/
   clear: both;
   }
  li:not(p) a {
   max-width: 175px;
   float: left;
   }
  li:not(p):after {
   content: "...";
   float: left;
   width: 25px;
   padding-left: 5px;
   color: #df3a0e;
   }

-->
</style>
<ul>
<li><a href="#">web标准常见问题大全web标准常见问题大全</a></li>
<li><a href="#">web标准常见问题大全web标准常见问题大全</a></li>
<li><a href="#">web标准常见问题大全web标准常见问题大全</a></li>
<li><a href="#">web标准常见问题大全web标准常见问题大全</a></li>
<li><a href="#">web标准常见问题大全web标准常见问题大全</a></li>
</ul>


LI标签中内容超过长度后以省略号显示的方法 相关文章:
LI标签中内容超过长度后以省略号显示的方法 相关软件:
特别声明:本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员,我们尽快予以更正。
转载请注明来源:http://www.xgdown.com