css垂直居中代码|css水平居中代码总结大全

一.水平居中
1.给父元素设置text-align:center可以实现文本、图片等行内元素的水平居中；
2.确定宽度的块级元素通过设置：margin:0 auto;来设置居中；
3.不确定宽度的块级元素的水平居中
  方法一：
    用table包含住需要居中的块级元素，设置table的属性为：margin:0 auto;

  方法二：
    设置display:inline解决

  方法三：
    设置父元素和子元素：float:left;position:relative;
    然后父元素:left:50%;
    子元素:left:-50%;


二.垂直居中
1.父元素高度不确定的，文本、图片、块级元素
  给父容器设置上下边距;

2.父元素高度确定，单行文本
  给父元素设置line-height值等于高度

3.父元素高度确定，文本、图片、块级元素
  方法一：
    用table包含，设置vertical-align值为middle

  方法二：
    设置父元素和子元素：float:left;position:relative;
    然后父元素:top:50%;
    子元素:top:-50%;

上一条： 如何设计一个漂亮精致的网页按钮
下一条： ps五个简单技巧为你的网页设计添加光影效果