不定宽高元素的水平垂直居中

1. table-cell方法

/*父元素*/
{display:table-cell;vertical-align:middle;text-align:center}
/*子元素*/
{vertical-align: middle;display:inline-block}

2. transform方法

/*父元素*/
{position:relative}
/*子元素*/
{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}

3. flex方法

/*父元素*/
{display:flex;justify-content:center;align-items:center;}

 

posted @ 2016-10-11 22:19  全玉  阅读(278)  评论(0编辑  收藏  举报