前端-------文字溢出部分省略号显示

1、代码展示

 

<html>
<head>
<meta charset="UTF-8">
<title>溢出文字省略号显示</title>
<link rel="stylesheet" href="css/sublime.css"/>
<style type="text/css">　
　　li {
　　　　width: 200px;
　　　　height: 30px;
　　　　white-space: nowrap;      /*强调在同一行内显示所有文字，知道文本结束或者遭到br换行*/
　　　　overflow: hidden;         /*超出部分隐藏*/
　　　　text-overflow: ellipsis;  /*溢出部分用省略号代替*/
　　　　line-height: 30px;
　　　}
</style>
</head>

<body>
　　<li>文字内容很多显示不下文字内容很多显示不下文字内容很多显示不下文字内容很多显示不下</li>
</body>
</html>

2、页面展示

 

3、使用工具：sublime

posted on 2019-11-19 10:08  圣上不开心吖  阅读(718)  评论(0)    收藏  举报