如何设置超出部分不显示?"/>
不隐藏html超出部分,css如何设置超出部分不显示?
平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱。这样我们就需要解决如何使用CSS来超出设置CSS宽度和CSS高度的内容自动隐藏掉,又不撑破DIV布局。
我们可以使用CSS overflow样式设置超出部分不显示:
对应样式overflow:hiddenDiv{overflow:hidden}
这样设置后,假如DIV对象设置一定宽度高度,此时加入overflow:hidden将会隐藏超出DIV宽度高度的内容包括图片。
示例:
.div1{ width:300px; height:50px; line-height:25px; overflow:hidden}
/* 设置对象高度宽度,同时设置overflow:hidden */
这是一些文本。 这是一些文本。 这是一些文本。 这是一些文本。这是一些文本。 这是一些文本。 这是一些文本。 这是一些文本。 这是一些文本。
这是一些文本。 这是一些文本。 这是一些文本。
效果图:
属性值:visible 默认值。内容不会被修剪,会呈现在元素框之外。
hidden 内容会被修剪,并且其余内容是不可见的。
scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。
更多推荐
不隐藏html超出部分,css如何设置超出部分不显示?
发布评论