<li></li>列表中显示文字强制不换行,大于li宽度自动隐藏文字
2013-06-06 13:50
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属性(特性)
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属性(特性)
相关文章推荐
- <li></li>列表中显示文字强制不换行,大于li宽度自动隐藏文字
- li列表中显示文字强制不换行,大于li宽度自动隐藏文字
- ul li列表中显示文字强制不换行大于li宽度的文字自动隐藏
- ul li列表中显示文字强制不换行大于li宽度的文字自动隐藏
- 解决html表格中内容超出不强制换行和超出宽度自动隐藏并显示省略号
- 解决html表格中内容超出不强制换行和超出宽度自动隐藏并显示省略号
- <span>中显示文字超出宽度如何自动隐藏
- li内文字超出隐藏,不允许出现半汉字截断,超出后仍显示new图片,小于宽度自动跟随
- 解决html表格中内容超出不强制换行和超出宽度自动隐藏并显示省略号
- IE 6与IE 7 出现 Ie6下<li>不自动换行的问题
- 重写java中JButton,实现图片下显示文字(根据图片宽度文字自动换行)
- 使用<pre></pre> 保留制表符\t 换行符\t\r 格式显示,并强制换行
- GridView实现自动编号;GridView实现自定义时间货币等字符串格式;GridView实现用“...”代替超长字符串;GridView一般换行与强制换行;GridView显示隐藏某一列;
- UILabel 多行显示<自动换行>
- CSS实现超出DIV宽度文字自动隐藏并显示省略号
- 关于ul下<li></li>内插入<span>内容</span>标签自动换行不在同一行问题
- <ul><li></li></ul>之间的文字居中水平显示
- 内容超出表格<td>宽度则自动隐藏
- 标签<view>文字自动换行
- 如何实现:GridView 控件中显示的文本不自动换行,隐藏超出宽度部分wj-wangjun