我们来谈谈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中文网站
标签:
免责声明:本文由用户上传,如有侵权请联系删除!