用css使单行超出指定宽度的内容切去并在结尾出现省略号(IE FF 通
用css使单行超出指定宽度的内容切去并在结尾出现省略号(IE FF)
为了更符合实际，我用一个div装起要调试的内容,并为这个div定义一个宽度。
例如：
css:
div{width:200px;}
html:
这是我要测试的字符串内容,这是我要测试的字符串内容,
在IE中实现是非常简单的，CSS 如下：
span{
width:200px;
display: block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
但在FF中用上面的样式是实现不了的,因为text-overflow: ellipsis;是IE中特有的(非CSS标准)。现在在FF下看到的仅仅只是把溢出的内容切除了，说到"溢出切除",这下说到点子上了，在FF中实现就要用到非常规的方法，一个标签作切除内容，再加一个标签作填补省略号用，并且加起来的长度就能超过容器的宽度，本例指的就是DIV的宽度200px，实现的想法就是这样。那么继续进一试验，关于切除内容，这个已经基本上解决了，那就来说补省略号，不用JS，用CSS实现的话...[ 查看全文 ]
2016-02-19
标签:
