您现在的位置是: 首页 » 网页代码 » css如何强制不允许换行?
网页代码

css如何强制不允许换行?

网站优化小编十一月 25, 2019 7人已围观

在我们日常的编码中经常会遇到这段文字不可以换行,或者自动换行的需求。下面我们来看一下如何使用css设置强制文字不换行。

网站运营中栏目排名优化技巧

white-space:nowrap; 强制不换行,对中文英文都起作用。

css代码:

div{
    white-space:nowrap;
}

示例:

<html>
<head>
<style type="text/css">
p
{
white-space: nowrap
}
</style>
</head>
<body>

<p>
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
</p>

</body>
</html>

效果图:

网站运营中栏目排名优化技巧

white-space 属性设置如何处理元素内的空白。

这个属性声明建立布局过程中如何处理元素中的空白符。值 pre-wrap 和 pre-line 是 CSS 2.1 中新增的。

属性值:

  • normal 默认。空白会被浏览器忽略。

  • pre 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。

  • nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。

  • pre-wrap 保留空白符序列,但是正常地进行换行。

  • pre-line 合并空白符序列,但是保留换行符。

  • inherit 规定应该从父元素继承 white-space 属性的值。

相关文章

文章评论

    发表评论

    电子邮件地址不会被公开。

站点信息
  • 站点运行:218天
  • 网站程序:Wordpress
  • 主题模板:bvseo
  • 文章统计:2965 条
  • 文章评论:17 条
  • 微信公众号:扫描二维码,关注我们