overflow:hidden的使用

最新推荐文章于 2022-06-27 19:48:26 发布

Allison-L

最新推荐文章于 2022-06-27 19:48:26 发布

阅读量1.7k

点赞数 1

分类专栏： CSS 文章标签： CSS

本文链接：https://blog.csdn.net/weixin_40141473/article/details/92807653

版权

本文介绍了CSS中`overflow:hidden`的三个主要用途：1) 溢出隐藏，用于处理内容超过元素宽高的情况；2) 清除浮动，解决因子元素浮动导致的父元素高度为0的问题；3) 解决外边距塌陷，避免父元素因子元素的margin-top而下移。

摘要由CSDN通过智能技术生成

一、溢出隐藏

如果某一元素内容超过所给定的宽高，就会溢出。

<style type="text/css">
    .box{
        background-color: lightblue;
        width: 400px;
        height: 60px;
        margin: 0 auto;
        text-align: center;
    }
</style>

<body>
<div class="box">
	今天天气好晴朗！处处好风光！<br>
	今天天气好晴朗！处处好风光！<br>
	今天天气好晴朗！处处好风光！<br>
	今天天气好晴朗！处处好风光！<br>
</div>
</body>