1、 文字的水平居中
将一段文字置于容器的水平中点,只要设置text-align属性即可:
text-align:center;复制代码2、容器的水平居中
先为该容器设置一个明确宽度,然后将margin的水平值设为auto即可。
div#container { width:760px; margin:0 auto; }复制代码3、文字的垂直居中
a.对于单行文本,我们只需要将文本行高(line-height)和所在区域高度(height)设为一致即可:
b.多行文本垂直居中 多行文本垂直居中分为两种情况,一个是父级元素高度不固定,随着内容变化;另一个是父级元素高度固定。1)父级元素高度不固定
父级高度不固定的时,高度只能通过内部文本来撑开。这样,我们可以通过设置内填充(padding)的值来使文本看起来垂直居中,只需设置padding-top和padding-bottom的值相等:
2)父级元素高度固定我们可以设置父级div的display属性:display: table;;然后再添加一个div包含文本内容,设置其display:table-cell;和vertical-align:middle;。具体代码如下:
4、div垂直居中,利用绝对布局absolute 5、div左右布局在子元素上加float:left; 在父元素上加clearfix
6、div左中右布局