HTML常用设置【持续更新】

水平垂直居中

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

https://blog.csdn.net/liufeifeinanfeng/article/details/78615567

水平:

  1. 方法一:在父容器上定义固定宽度,margin值设成auto
  2. 在子元素中将display设置为inline-block,父元素text-algin设置为center

垂直:

       1. table-cell

  <style type="text/css">
        .parent {
             200px;
            height: 200px;
            display: table-cell;
            vertical-align: middle;
            text-align: center;     
        }
        .child {
            /*display: inline-block;*/
            background-color: orangered;
        }
    </style>

          2. flex

    <style type="text/css">
        .parent {
             200px;
            height: 200px;
            display: flex;
            justify-content:center;
            align-items:Center;
        }
        .child {
            /*display: inline-block;*/
            background-color: orangered;
        }
    </style>

        3. 单行文本设置 line-height

原文地址:https://www.cnblogs.com/ycc1/p/14118914.html