注册
登录
论坛
家园
电台
搜索
导航
私人消息 (0)
公共消息 (0)
论坛任务 (0)
系统消息 (0)
好友消息 (0)
帖子消息 (0)
小鬼论坛
»
╉网络地带╊
» 如何用 CSS 将超出显示宽度的内容隐藏起来
【注册】获得论坛邀请码!
[提示]本站贴图请注意!
社区新会员朋友签到
诚招版主,欢迎加入社区!
【增加贡献】本站宣传贴
论坛之星评选[现金积分兑奖]
本站免责声明
本站专用QQ群
返回列表
发帖
尘起缘飞
发短消息
MSN 聊天
加为好友
尘起缘飞
(爱上小鬼)
当前离线
UID
2
帖子
12248
主题
3001
精华
15
积分
17755
威望
1851
XG币
303807
贡献
727
阅读权限
255
性别
男
来自
╉ 小鬼论坛 ╊
在线时间
3954 小时
注册时间
2004-8-10
最后登录
2025-5-7
管理员
UID
2
帖子
12248
积分
17755
阅读权限
255
在线时间
3954 小时
1
#
跳转到
»
倒序看帖
打印
字体大小:
t
T
发表于 2007-5-26 13:06
|
只看该作者
如何用 CSS 将超出显示宽度的内容隐藏起来
CSS:
<style type="text/css"> .textOverFlow { width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; border:1px solid #ddd; } </style>
HTML:
<div class="textOverFlow"> xueol.com 精华代码 xueol.com 精华代码 xueol.com 精华代码xueol.com 精华代码xueol.com 精华代码xueol.com 精华代码xueol.com 精华代码xueol.com 精华代码</div>
实现原理:
(1)指定宽度:width:300px;
(2)overflow:hidden; 将超出内容隐藏
(3)text-overflow:ellipsis; IE 专有属性,当对象内文本溢出时显示省略标记(...)
(4)white-space:nowrap; 强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象。
收藏
分享
删除昨天的烦恼,选择今天的快乐,
设置明天的幸福,存储永远的爱心,
取消世间的仇恨,粘贴美好的心情,
复制醉人的风景,打印迷人的笑脸。
祝来到XGHOME的朋友每天都有好心情!
小鬼论坛
小鬼
发短消息
加为好友
小鬼
当前离线
UID
1
帖子
3393
主题
569
精华
4
积分
3674
威望
158
XG币
10251
贡献
0
阅读权限
255
来自
小鬼论坛
在线时间
768 小时
注册时间
2004-8-10
最后登录
2012-3-13
管理员
UID
1
帖子
3393
积分
3674
阅读权限
255
在线时间
768 小时
2
#
发表于 2007-6-7 19:57
|
只看该作者
有那么一点感觉
但不是很明显
每个人的生活里都是有遗憾的,因为遗憾,我们才生活在一种错过的美丽里……
TOP
返回列表
╉公告管理╊
╉动感影视╊
╉杂谈随感╊
╉科幻灵异╊
╉疯狂水吧╊
╉小说驿站╊
╉仙乐飘飘╊
╉生活元素╊
╉自拍倩照╊
[收藏此主题]
[关注此主题的新回复]
[通过 QQ、MSN 分享给朋友]