ul li列表中显示文字强制不换行大于li宽度的文字
网站建设 2023-01-28 21:39www.1681989.com免费网站
复制代码
代码如下:li{
display:block;
font-size:14px;
height:16px;
le-height:16px;
width:330px;
white-space:nowrap; //强制不换行
overflow:hidden; //自动隐藏文字
text-overflow: ellipsis; //文字隐藏后添加省略号
-o-text-overflow:ellipsis; //适用于opera浏览器
}
涉及关键属性的语法:
1、语法
text-overflow : clip | ellipsis
参数
clip : 不显示省略标记（...），而是简单的裁切
ellipsis : 当对象内文本溢出时显示省略标记（...）
2、
语法
overflow : visible | auto | hidden | scroll
参数
visible : 不剪切内容也不添加滚动条。假如显式声明此默认值，对象将被剪切为包含对象的wdow或frame的大小。并且clip属性设置将失效
auto : 此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条
hidden : 不显示超过对象尺寸的内容
scroll : 总是显示滚动条
3、
语法
white-space : normal | pre | nowrap
参数
normal : 默认处理方式
pre : 用等宽字体显示预先格式化的文本。不合并字间的空白距离和进行两端对齐。参阅pre对象
nowrap : 强制在同一行内显示所有文本，直到文本结束或者遭遇br对象。参阅td，div等对象的nowrap属性（特性）
上一篇：div与span的区别和使用示例
下一篇：多重CSS背景动画实现方法示例