css怎么设置溢出隐藏
程序员文章站
2022-03-04 23:30:10
...
css设置溢出隐藏的方法：首先创建一个HTML示例文件；然后在body中定义一些p标签内容；最后通过“overflow:hidden”属性来设置溢出隐藏即可。
本文操作环境：Windows7系统、HTML5&&CSS3版，DELL G3电脑
在CSS中，可以利用overflow属性，使用overflow:hidden来设置溢出隐藏。
overflow属性
overflow属性规定当内容溢出元素框时发生的事情。
这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。
说明：所有主流浏览器都支持 overflow 属性。
可能的值
visible：默认值。内容不会被修剪，会呈现在元素框之外。
hidden：内容会被修剪，并且其余内容是不可见的。
scroll：内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto：如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
div {
background-color: pink;
width: 150px;
height: 150px;
overflow: hidden
}
</style>
</head>
<body>
<p>如果元素中的内容超出了给定的宽度和高度属性，overflow 属性可以确定是否显示滚动条等行为。</p>
<div>
这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，
用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。
默认值是 visible。
</div>
</body>
</html>
效果图：
推荐学习：《css视频教程》
以上就是css怎么设置溢出隐藏的详细内容，更多请关注其它相关文章！
上一篇： javascript有split函数吗
下一篇： css不透明度怎么设置