css水平居中
1. 行内元素
行内元素(文字,图片等)可以给父级元素设置text-align:center,使子级行内元素居中;
2 . 块级元素
给该元素设置margin:auto;
代码部分
3 . 不定宽的块级元素
3.1 父元素为table标签;
代码部分
实际效果
3.2 将子元素设置为inline,再给父元素添加text-align:center;
代码部分
3.3 给父级设置dispaly:inline-block,再用绝对定位position: relative并设置left:-50%;
代码部分
css垂直居中
1. 可以通过给确定高度的父级设置line-hight等于该高度,让是文本类的子元素居中;
2 .利用 position: absolute和margin:auto实现.
代码部分
实际效果
3 .利用 position: absolute和margin:top实现.
代码部分
4 .创建一个无意义的标签,让它占据整个盒子一半的高度,从而在展示上达到垂直居中;
代码部分
5 .给父级设置table-cell,和文本居中vertical-align:middle配合
代码部分
实际效果
网友评论