html制作网页时，经常会遇到div居中显示的问题。div的水平居中、垂直居中、文字居中等，在此做一个简单的总结，希望能有所帮助。 1.通过设置margin-left和margin-right，div水平居中； 2.通过设置text-align，文字居中； 3.通过设置position,top,left,margin-left;margin-top，水平垂直居中。
工具/原料
文本编辑器（txt,notepad,sublime text等）
div水平居中
div里的文字居中
文字居中只需要添加属性text-align:center即可。
div水平垂直居中
1
设置div的属性width:400px; height:300px; border:1px solid blue; text-align: center; top:50%; left:50%; position:absolute; margin-left: -200px; /*width的一半*/ margin-top: -150px; /*height的一半*/达到水平垂直居中的效果。
2
注意，margin-left和margin-top的偏移量跟div的高度和宽度相关。
注意事项
1
注意水平垂直居中时position:absolute;设置
2
其实需要记住的代码就几行，记住了就OK.
上一篇：wps表格中的文字怎么上下居中
下一篇：word中设置文字行距居中