css使溢出的文字显示为省略号...

html代码：

	<div class="box1">
		单行显示：autocomplete 属性规定 form 或 input 域应该拥有自动完成功能。
		当用户在自动完成域中开始输入时，浏览器应该在该域中显示填写的选项。
	</div>
	<div class="box2">
		多行显示：autocomplete 属性规定 form 或 input 域应该拥有自动完成功能。
		当用户在自动完成域中开始输入时，浏览器应该在该域中显示填写的选项。
	</div>

style样式：

		.box1{
			width:200px;
			height: 30px;
			line-height: 30px;
			background: pink;

			overflow: hidden;
			text-overflow: ellipsis;/*使溢出文字以省略号显示*/
			white-space: nowrap;/*使文字在同一行显示，不换行*/
		}
		.box2{
			width:200px;
			height: 80px;
			line-height: 40px;/*设置为两行*/
			margin-top:20px;
			background: yellow;
			/*以下5条，缺一不可*/
			overflow: hidden;
			text-overflow: ellipsis;
			display:-webkit-box;
			-webkit-line-clamp:2;/*在第二行显示...*/
			-webkit-box-orient: vertical;
		}

效果图：

好了，如果帮到你，请点赞哦！互相交流，互相学习。