以前对css没有了解的时候经常使用字符串截取来实现文字加省略号的展现形式,今天对css进行了一下研究,发现css也提供了截取显示的功能
css代码如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
.ea_articleList_element{width:300px;overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
</style>
</head>
<body>
<span class=ea_articleList_element>
文章模块列表2fdsfdsfdsfdsfdsfdsfdsfdsfdsfdsfdsfdsfds
</span>
<div class=ea_articleList_element>
文章模块列表2fdsfdsfdsfdsfdsfdsfdsfdsfdsfdsfdsfdsfds
</div>
</body>
</html>
展现效果如下:
chrome:
firefox:
ie:
可以看见在IE上不仅对块元素有效果对内嵌元素也有效果,而子啊chrome和firefox上仅仅对块元素有效果