效果图
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
.lab {
/*溢出部分隐藏*/
overflow: hidden;
/*将被隐藏的那部分用省略号代替。*/
text-overflow: ellipsis;
/*为了保证无论单元格中文本内容有多少,都不会自动换行,此时多余的内容会在水平方向撑破单元格。*/
white-space: nowrap;
/*给标签设置溢出宽度*/
150px;
/*让标签可视化(主要是针对块状元素--常用的有:<div>,<p>,<h1>...<h6>,<ol>,<ul>,<dl>,<table>,<address>,<blockquote>,<form>)*/
display: block;
}
</style>
</head>
<body>
<label>溢出未处理:xxxxxxxxxxxxxxxxxx</label>
<label class="lab">溢出处理后:xxxxxxxxxxxxxxxxxx</label>
</body>
</html>