1949啦网--小小 痛苦,是因为能力和欲望不匹配造成的

CSS3 text-overflow 属性

text-overflow是CSS3的一个属性,其作用是当文本溢出包含它的元素时,应该裁剪还是将多余的字符用省略号来表示。

该属性一般和overflow:hidden属性一起使用。

text-overflow: clip|ellipsis|string

语法    text-overflow: clip|ellipsis|string;

clip       修剪文本

ellipsis   使用省略号来代表修剪的文本

string     使用给定的字符串来代表被修剪的文本

white-space:nowrap;  //段落中文字不换行

text-overflow: ellipsis;  // 多出的内容省略号...

overflow:hidden;  //是让多出的内容隐藏起来

<!DOCTYPE html>  <html>  	<head>  		<meta charset="UTF-8">  		<title></title>  		<style type="text/css">  			.dd{  				width: 150px;  				height: 30px;			  				border: 1px solid darkcyan;  			}  			.dd p{  				font-size: 15px;  				margin: 0 auto;  				white-space:nowrap;    /*强制不换行*/  				text-overflow:ellipsis;  /*多出的内容省略号...*/  				overflow:hidden;      /*多出的内容隐藏起来*/  			}  		</style>  	</head>  	<body>  	<div class="dd">  		<p>当文本溢出时,用省略号代替溢出的文本</p>  	</div>        	</body>  </html>

原文链接:https://www.qiquanji.com/post/8702.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

微信扫码关注

更新实时通知

作者:xialibing 分类:网页教程 浏览: