手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >ul li列表中显示文字强制不换行大于li宽度的文字自动隐藏
ul li列表中显示文字强制不换行大于li宽度的文字自动隐藏
摘要:li{display:block;font-size:14px;height:16px;line-height:16px;width:330...

li{

display:block;

font-size:14px;

height:16px;

line-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 : 不剪切内容也不添加滚动条。假如显式声明此默认值,对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效

auto : 此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条

hidden : 不显示超过对象尺寸的内容

scroll : 总是显示滚动条

3、

语法:

white-space : normal | pre | nowrap

参数:

normal : 默认处理方式

pre : 用等宽字体显示预先格式化的文本。不合并字间的空白距离和进行两端对齐。参阅pre对象

nowrap : 强制在同一行内显示所有文本,直到文本结束或者遭遇br对象。参阅td,div等对象的nowrap属性(特性)

【ul li列表中显示文字强制不换行大于li宽度的文字自动隐藏】相关文章:

用css实现文字的自动隐藏

DIV+CSS网页设计常用布局代码

左中右3栏最先显示中栏内容的方法

css实现li中文本超出行宽自动隐藏

css强制文字不换行实现代码

中文字体在CSS中的表达方式

css基本语法

如何用CSS让文字居于div的底部

CSS控制让每行显示4个图片的样式

html-css设置标签样式不起作用的2点原因

精品推荐
分类导航