模板酷站
电脑版
提示:
原网页
已由神马搜索转码, 内容由
www.mb5u.com
提供.
无忧首页
网页模板
程序模板
建站教程
视频教程
更多导航↓
网页特效
图标素材
字体下载
站长工具
站长问答
CMS教程
Div+Css教程
网站制作教程
网站运营
网络编程
服务器教程
站长工具
Div+Css教程
模板无忧
>
建站教程
>
Div+Css教程
>
Div+CSS教程
>
如何设置列表(li)超出部分显示省略号?_Div+CSS教程
编辑Tag赚U币
教程Tag:
暂无Tag,欢迎
添加
,赚取U币!
织梦DedeCMS视频教程
买空间 租服务器 选网硕互联!
无忧站长工具,百度权重一键全查!
我们经常希望列表中的内容,超过设置的长度的时候,不要撑开父元素,也不希望它直接换行;我们更愿意让其超过部分用省略号来代替。而在title标签中,置放的是完整的标题。
这样的方法新手们经常不知道该如何搞定。下面就是方法的演示。不过请注重此方法适用与IE与OP浏览器!
设置li超出部分显示省略号的方法
代码调试框
[www.mb5u.com]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>mb5u.com</title> <style type="text/css"> li { width:200px; white-space:nowrap; text-overflow:ellipsis; overflow: hidden; } </style> </head> <body> <ul> <li><a href="/tz.php?url=www.mb5u.com#">mb5u.com - Div CSS布局 常见问题</li> <li><a href="/tz.php?url=www.mb5u.com#">mb5u.com - Div CSS布局 常见问题</li> <li><a href="/tz.php?url=www.mb5u.com#">mb5u.com - Div CSS布局 常见问题</li> <li><a href="/tz.php?url=www.mb5u.com#">mb5u.com - Div CSS布局 常见问题</li> <li><a href="/tz.php?url=www.mb5u.com#">mb5u.com - Div CSS布局 常见问题</li> <li><a href="/tz.php?url=www.mb5u.com#">mb5u.com - Div CSS布局 常见问题</li> <li><a href="/tz.php?url=www.mb5u.com#">mb5u.com - Div CSS布局 常见问题</li> <li><a href="/tz.php?url=www.mb5u.com#">mb5u.com - Div CSS布局 常见问题</li> </ul> </body> </html>
[ 可先修改部分代码 再运行查看效果 ]
网站制作在线视频教程
网站制作视频教程打包下载
DIV+CSS模板
CSS视频教程
CSS设计彻底研究视频教程
网页制作基础教程
网站重构&web标准设计教程
div css视频教程
来源:无忧整理
/
所属分类:
Div+CSS教程
/
更新时间:2007-01-09
最新评论:
暂时还没人评论! 快来抢沙发啊!
请在这里输入您要发表的评论信息! 理智评论,文明上网,共建和谐网络. 严禁广告、谩骂等不良信息.
匿名评论
相关
Div+CSS教程
:
DIV+CSS设计的误区
CSS基础:常用CSS英文字体介绍
IE6和IE7中border边框断线现象
border:none;与border:0;的有什么不同?
div+css下js对联广告不随屏幕滚动的解决方法
HTML元素的ID和Name属性的区别
divcss教程:深入了解css的行高Line Height属性
CSS文档流,块级元素和内联元素
5个你该知道的CSS3新技术
用正则表达式替换a标记href值
30个优秀的CSS导航和按钮设计教程
css中px和em有什么区别
Div+Css教程搜索
Div+CSS教程推荐
闭合浮动元素(clearingfloat)的简单方法
该如何正确的使用position属性它的作用是什么?
CSS标识当前位置页效果的实现原理
FF下文本无法撑开容器的高度的原因及解决方法
firefox下使连续长字段自动换行
DuplicateCharactersBug在IE中的HTML注释引起文字奇怪的复制
Div CSS三列布局最先显示中列的方法
DivCSS布局扩展技巧和用法
CSS初始化代码
WEB2.0标准教程:第四天调用样式表
猜你也喜欢看这些
DivCSS布局实例用dldtdd来制作列表
CSS实例:如何让无空格的长字符在IE和FF下面实现自动换行?
DIVCSS实例:橙蓝互换的CSS翻页效果
DIVCSS菜单:超炫的菜单一张图片实现鼠标的两种状态及CSS当前页效果
DIV CSS布局入门示例(三)页面顶部制作
DIV CSS布局实例:半透明阴影效果的实现
DivCSS实例:符合web标准的嵌入Flash的方法-JS调用
CSS菜单实例:简洁的效果火红的围城
CSS布局实例:仅一张图片实现圆角!
DIVCSS菜单:纵向CSS菜单实例之橙色记忆
新热推荐
1
/
3
dedecms模板_简洁大气的网络设计工作室模板
织梦蓝色简洁新闻资讯门户模板下载(原创)
织梦橙黑清新炫酷工作室模板(视频演示)
织梦文章/新闻资讯/博客模板(仿chinaz最新版,蓝色简洁大气)
Wordpress淘宝客程序(淘金渡-强大自动采集功能 可做返利类淘宝客网站)
精仿大前端D8主题织梦模板下载
织梦网络工作室模板,2013年最新设计,大气美观
织梦科技IT资讯类博客模板(仿虎嗅网织梦模板)
dedecms织梦漫画网站模板(带采集+漫画连载)
织梦dedecms文章模板博客模板-可自定义颜色
PhotoShop鼠绘超酷的游戏场景
Photoshop实例教程:照片漫画插画效果的制作
相关链接:
复制本页链接
|
搜索如何设置列表(li)超出部分显示省略号?
教程说明:
Div+CSS教程
-
如何设置列表(li)超出部分显示省略号?
。