css不知宽高的元素居中

  方法1:反向移动

  1. position:absolute;  
  2.   top:50%;  
  3.   left: 50%;  
  4.   -webkit-transform: translate(-50%, -50%);  
  5.   transform: translate(-50%, -50%);  

  方法2:flex布局

  1.  display: flex;  
  2.  align-items: center;  
  3.  justify-content: center; 

  方法3:四向定位  

  1. position: absolute;
  2. right: 0;
  3. left: 0;
  4. top: 0;
  5. bottom: 0;
  6. margin: auto;

  方法4:表格

  father{

    display:table;

    text-algin:center;

  }

  son{

    display:table-cell;

    vertical-align:middle;

  }

 

posted @ 2017-04-18 16:27  晨光暖日  阅读(712)  评论(0编辑  收藏  举报