首頁  >  問答  >  主體

css3 - 如何让div中的内容水平居中,垂直居中

将内容区域的样式设置成这样,可以解决,可是在编码的时候也会有很多问题。

.element {
    width: 60px; height: 40px;
    position: absolute; left: 0; top: 0; right: 0; bottom: 0;
    margin: auto;    /* 有了这个就自动居中了 */
    border:1px solid red;
}

有其他的方法吗

怪我咯怪我咯2767 天前1087

全部回覆(3)我來回復

  • PHP中文网

    PHP中文网2017-04-17 11:25:59

    首先get一個新方法;
    我通常這樣居中
    .element {

    width: 60px; height: 40px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform:translate(-50%,-50%);
    border:1px solid red;
    }

    回覆
    0
  • 高洛峰

    高洛峰2017-04-17 11:25:59

    你需要:CSS佈局之-水平垂直居中

    回覆
    0
  • 巴扎黑

    巴扎黑2017-04-17 11:25:59

    看這裡 http://f2e.souche.com/blog/jie-du-cssbu-ju-zhi-shui-ping-chui-zhi-ju-zhong/

    回覆
    0
  • 取消回覆