zoukankan      html  css  js  c++  java
  • CSS居中

    水平居中
    在不说float效果的影响下,属性margin:0 auto只对块级元素起作用,用于设置自身。

    在不说float效果的影响下,属性text-align:center只对inline和inline-block元素有效,用于设置子元素居中。
    (子元素为block时默认占据整行,所以没有效果)

    水平垂直居中

    定位和需要定位的元素的margin减去自身宽高的一半

    子元素:
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
    绝对定位:上下左右自动
        100px;
    height: 100px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    绝对定位和transfrom
       100px;
    height: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);

    父元素diplay:table-cell
       display: table-cell;
    vertical-align: middle;
    text-align: center;


  • 相关阅读:
    python 小练习 5
    python 小练习4
    python 小练习3
    python 小练习2
    遇到后缀名为whl的库的安装方法
    hdu1394Minimum Inversion Number
    Triangle
    codeforces B. Pasha and String
    F
    C
  • 原文地址:https://www.cnblogs.com/littlewriter/p/6494297.html
Copyright © 2011-2022 走看看