HTML各种情况居中总结
浏览数：15 /
时间：2015年06月09日
前提： 父盒子固定大小（宽高），其里面的“内容”在水平和垂直方向的居中对齐的常见做法：
内部居中：
水平居中：
A：“内容”为一行文字或文字性行内元素（span，a，b，u）：在父盒子上设置text-align:center;
B：“内容”为具有一定形状的行内元素（如img，input，textarea）：同文字（Ａ）
C：“内容”为块元素： margin:0 auto;
垂直居中：
A：“内容”为一行文字或文字性行内元素（span，a，b，u）：在父盒子上设置line-height为父盒子的高度；
B：“内容”为具有一定形状的行内元素（如img，input，textarea）：同块元素（Ｃ）
C：“内容”为块元素： 在块元素上设置：position:relative;top为父盒子高度一半;margin-top为该块元素高度一半的负值
外部居中：
img与textarea与其紧挨着的文字垂直居中对齐：设置其vertical-align:middle;
input与紧挨着的文字自然垂直居中
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
