CSS中将超出文本隐藏并用省略号代替的方法

  介绍

小编给大家分享一下CSS中将超出文本隐藏并用省略号代替的方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!

在CSS中文本超出可以使用溢出:隐藏来隐藏以及CSS中的文本溢出属性给隐藏部分添加省略号

经常在写页面的时候会碰到文字内容太多超过盒子内容对于这种情况我们会常常用溢出:隐藏来隐藏,但是今天就要告诉大家一个新的小知识点,我们可以用它将超出部分的文章隐藏,并用省略号代替,接下来将在文章中具体和大家介绍

<强> html代码

p {   宽度:300 px;   高度:30 px;   边界:1 px固体# ccc;   text-align:中心;   字体大小:12 px;   行高:30 px;   }   & lt;/style>   & lt;/head>   & lt; body>   & lt; p>提供大量免费,原创,高清的php视频教程,并定期举行公益php培训!可边学习边在线修改示例代码,查看执行效果!   php从入门到精通,一站式php自学平台! & lt;/p>

 CSS中将超出文本隐藏并用省略号代替的方法

<强>文本溢出属性

规定当文本溢出包含元素时发生的事情,它是CSS3中的属性,它有三个值分别为

<强>片段:修剪文本,将超出部分删除

文本溢出:剪辑;   溢出:隐藏;   空白:nowrap;}规定段落中的文本不进行换行

 CSS中将超出文本隐藏并用省略号代替的方法

<强>省略号:用省略号来代替被删除的内容

文本溢出:省略;   溢出:隐藏;   空白:nowrap;}

 CSS中将超出文本隐藏并用省略号代替的方法

<强>当鼠标放上时被隐藏的字显示

溢出:可见;

 CSS中将超出文本隐藏并用省略号代替的方法

以上是CSS中将超出文本隐藏并用省略号代替的方法的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注行业资讯频道!

CSS中将超出文本隐藏并用省略号代替的方法