文本溢出进行省略,显示“...”

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css"> 
			p{
				width: 200px; 
				/*溢出文字显示“...”(省略)*/
				text-overflow: ellipsis;  
				/*文本不换行*/
				white-space: nowrap; 
				/*超出的隐藏*/
				overflow: hidden;   
			} 
			p span{ 
				float: right; 
			}
		</style>
	</head>
	<body>
		<p><span>2018-10-9</span>实现多余的文字用省略号显示</p>
	</body>
</html>

猜你喜欢

转载自blog.csdn.net/Lyj1010/article/details/82985700