HTML 水平居中垂直居中垂直水平居中的几种实现方式

最新推荐文章于 2023-09-18 15:02:14 发布

az44yao

最新推荐文章于 2023-09-18 15:02:14 发布

阅读量303

点赞数

本文链接：https://blog.csdn.net/az44yao/article/details/90510337

版权

https://blog.csdn.net/qq_31674679/article/details/81502033

水平居中

方法一：在父容器上定义固定宽度，margin值设成auto

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>helloworld</title>
    </head>
    <style type="text/css">
        .div1{
            background-color: blue;
            width: 200px;
            margin: auto;
        }
        .div2{
            background-color: orangered;
        }
    </style>
    <body>
        <div class="div1">
            <div class="div2">
                你好啊！！！！！！！！！
            </div>
        </div>
    </body>

</html>