css中设置外边距（margin）

最新推荐文章于 2024-09-30 16:15:12 发布

原创最新推荐文章于 2024-09-30 16:15:12 发布 · 1.8k 阅读

0 ·

CC 4.0 BY-SA版权

css 专栏收录该内容

5 篇文章

订阅专栏

本文详细介绍了CSS中关于外边距(margin)的使用方法及其特性。包括如何影响页面布局，特别是子元素与父元素间及兄弟元素间的外边距表现。通过实际案例帮助读者更好地理解和运用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>外边距</title>
        <!--外边距--margin：盒子与和盒子之间的距离
          1.相连子元素外边距会传递给父元素--打断相连
          2.相连兄弟元素如果有相连的外边距会发生重叠，会取较大的那一个
          <div></div>--块状元素
         -->

        <style type="text/css">
            .box1{
            width: 200px;
            height: 100px;
            .box2{

            }
            .box3{

            }
        </style>
    </head>
    <body>
        <div class="box1">
         <div class="box3">

         </div> 
        </div>
        <div class="box2">

        </div>
    </body>
</html>