1.溢出属性(容器的)
属性 | 属性值 | 说明 |
---|
overflow | visible | 默认值,溢出内容会显示在元素之外 |
| hidden | 溢出内容隐藏 |
| scroll | 滚动,溢出内容以滚动方式显示 |
| auto | 如果溢出会添加滚动条,没有溢出正常显示 |
| inherit | 规定应该遵循从父元素继承overflow属性的值 |
| overflow-x:X轴溢出; overflow-y:Y轴溢出 | |
2.空余空间
属性 | 属性值 | 说明 |
---|
white-space | normal | 默认值,空白会被浏览器忽略 |
| nowrap | 文本不会换行,文本会在同一行上继续,知道遇到<br/> 标签为止; |
| pre | 显示空格,回车,不换行 |
| pre-wrap | 显示空格,回车,换行 |
| pre-line | 显示回车,不显示空格,换行 |
| inherit | 该属性用来设置如何处理元素内的空白 |
3.省略号显示
当单行文本溢出显示省略号需要同时设置一下声明:
1.容器宽度:width:200px
2.强制文本在一行内显示:white-space:nowrap;
3.溢出内容为隐藏:overflow:hidden;
4.溢出文本显示省略号:text-overflow:ellipsis;
属性 | 属性值 | 说明 |
---|
text-overflow | clip | 默认值,不显示省略号(…) |
| ellipsis | 显示省略标记; |