如何设置CSS样式使网页中过长的新闻标题后面以省略号显示

html-css024

如何设置CSS样式使网页中过长的新闻标题后面以省略号显示,第1张

在CSS中，text-overflow:ellipsis可以在文本隐藏时候在文本末尾加入省略号。所以如果Html里是用li写的。

 

li{text-overflow:ellipsisoverflow:hiddenwhite-space:nowrapdisplay:blockword-break:keep-all

本身不链接或者hover功能的元素也是可以实现它内部的元素隐藏

这样子就可以，你可以把li改成你的元素。

不设置div的高，可以使用white-space:nowrap来强制文字不换行。

然后再给当前容器设置溢出隐藏即可。

如

div{}

div span{float:right}

div p{white-space:nowraptext-overflow:ellipsisoverflow:hidden} <div>

    <span>2016-04-29</span>

    <p>然后再给当前容器设置溢出隐藏即可然后再给当前容器设置溢出隐藏即可然后再给当前容器设置溢出隐藏即可</p>

</div>

方法一、把.active加到li标签

li.active{background-color:#afc}

方法二、把a标签设置属性display

a{display:blockwidth:100%}