white-space空余空间
属性有:normal nowrap pre pre-wrap pre-line inherit
- normal:默认值,空白会被浏览器忽略
- nowrap:文本不会换行,文本会在同一行上继续,直到遇见<br/>标签为止(文本会很长很长很长)
- pre::显示空格,回车,不换行
- pre-wrap:显示空格,回车和换行
- pre-line:显示回车,不显示空格,换行
省略号显示
若先把溢出的文本用省略号(...)代替的话,可使用text-overflow:clip/ellipsis
- clip:默认值,不显示省略号
- ellipsis:显示省略号
- 当单行文本溢出显示省略号需要同时设置以下声明:
- 容器宽度 width: 200px;
- 强制文本在一行内显示 white-space: nowrap;
- 溢出内容为隐藏 overflow: hidden;
- 溢出文本显示省略号 text-overflow: ellipsis;