看到了个问题,问题地址:https://segmentfault.com/q/10...
目前没想到怎样不用行高解决问题,但是想到了之前工作中遇到的文本超出两行显示省略号,所以从之前的代码里翻出代码段记录下来,便于之后使用。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style media="screen">
*{
margin: 0;
padding: 0;
}
.example{
margin-right:20px;
font-size: 20px;
/*line-height: 1.5em;*/
}
.warp2{
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
-ms-text-overflow: ellipsis;
text-overflow: ellipsis;
}
</style>
</head>
<body>
<div id="test" class="example warp2">
如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文如图,如果在用户手机屏幕宽度下内容超出两行则显示阅读全文,否则不显示阅读全文
</div>
<script type="text/javascript">
</script>
</body>
</html>
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。