DIV+CSS布局－水平居中布局方法（当元素内容宽度小于元素宽度时）：
一、行内元素水平居中；
（一）文本节点元素水平居中：在其块状父元素上写如下样式：{text-align:center;};
（二）图像元素水平居中：在其块状父元素上写如下样式：{text-align:center;};
（三）背景图像水平居中方法：{background-position:center top};
二、块级元素水平居中；
（四）div元素水平居中：
1.父元素写样式{text-align:center;}
2.自身元素写样式{display:inline-block;}
（五）div元素水平居中：在自身元素上写如下样式：{margin:0 auto;width:固定值；};
（六）div元素水平居中：
1.父元素写{position:relative;确定宽度}
2.自身元素写{position:absolute;left:50%;margin-left:负的自身宽度的1/2；}
（七）div元素水平居中：
1.父元素写{position:relative;确定宽度}
2.自身元素写{position:absolute;left:50%;transform: translateX(-50%)；}