在css中,可以使用white-space属性来强制文字不换行;通常我们使用white-space:nowrap来强制文本文字内容不换行,文本会在在同一行上显示,直到遇到
标签为止。
white-space属性指定元素内的空白怎样处理。
语法:white-space : normal | pre | nowrap | pre-wrap | pre-line;
属性值:normal:默认。空白会被浏览器忽略。
pre:空白会被浏览器保留。其行为方式类似 HTML 中的
标签。
nowrap:文本不会换行,文本会在在同一行上继续,直到遇到
标签为止。
pre-wrap:保留空白符序列,但是正常地进行换行。
pre-line:合并空白符序列,但是保留换行符。
说明:
white-space设置或检索对象内文本显示方式。通常我们使用于强制一行显示内容
通常我们使用white-space:nowrap强制文本文字内容不换行,在对象内一行显示完所有文字内容。
示例:
p {
width: 400px;
height: 50px;
border: 1px solid red;
}
.nowrap{
white-space: nowrap;
}
普通文本!!!
这是一些文本。 这是一些文本。 这是一些文本。
强制文字不换行!!!
这是一些文本。 这是一些文本。 这是一些文本。
效果图: