2022年02月18日整理发布：css怎么实现禁止换行并超出隐藏

我们来谈谈css如何停止包装，超越隐藏。相信朋友们也应该密切关注这个话题。现在，我们来谈谈css如何停止包装并超越隐藏。边肖还收集了关于css如何停止包装并超越隐藏的相关信息。我希望你看到后会喜欢。

Css实现了禁止换行符和超越隐藏的方法：首先创建一个HTML样本文件；然后在正文中创建一些文本内容；最后，通过“空白”和“文本溢出”属性禁止内容换行和超出隐藏。

本文的运行环境：Windows7系统，HTML5CSS3版本3，DELL G3电脑

在CSS中，可以使用带有溢出属性的空白属性来实现文本不换行，多余部分隐藏。

空白属性指定如何处理元素中的空白。当值为nowrap时，文本不会换行，而是继续在同一行上，直到遇到br标记。

Overflow属性指定当内容溢出元素框时会发生什么。当该值设置为hidden时，内容将被修剪，其余内容将不可见。

！声明文档类型

超文本标记语言

头

meta charset='UTF-8 '

样式类型='text/css '

p {

宽度： 400 px；

高度： 100像素；

border: 1px纯红；

}。溢出{

white-space : nowrap；

飞越：隐藏；

}

/style

/head

身体

p普通文字！

这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。

这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。

/p

p class='溢出'

这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。

这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。

/p

/body

/html渲染：

还可以添加text-overflow属性来隐藏多余的部分，并将其显示为省略号。

text-overflow属性指定当文本溢出元素时会发生什么，它具有以下属性值：

剪辑修剪文本。

省略号显示省略号来表示修剪的文本。

字符串使用给定的字符串来表示被修剪的文本。

示例：

！声明文档类型

超文本标记语言

头

meta charset='UTF-8 '

样式类型='text/css '

p {

宽度： 400 px；

高度： 100像素；

border: 1px纯红；

}。文本溢出{

white-space : nowrap；

文本-overflow:省略号；

飞越：隐藏；

}

/style

/head

身体

p普通文字！

这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。

这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。

/p

'文本溢出'

这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。

这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。这里有一些文本。

/p

/body

/html渲染：

【推荐学习：css视频教程】以上就是css如何防止断行，超越隐藏的细节。请多关注php中文网站的其他相关文章！

来源：php中文网站

　　免责声明：本文由用户上传，与本网站立场无关。财经信息仅供读者参考，并不构成投资建议。投资者据此操作，风险自担。 如有侵权请联系删除！