<div class="text">这里是想要居中的文字</div>,
2样式表里这样写:
.text{text-align:center}
<div class="text" style=" text-align:center">这里是想要居中的文字</div>
写了两个例子,一个是利用这个line-height属性,一个是利用padding来设置,都达到了垂直居中的效果
<!doctype html><html>
<head>
<meta charset="utf-8">
<title>垂直居中</title>
</head>
<style>
*{padding:0margin: 0}
p span{float:left}
p{height:100pxline-height:100pxfont-size:25pxborder:1px solid redtext-align:center}
div span{float:leftheight:100pxpadding:30px 0pxfont-size:25px}
div{height:100pxborder:1px solid red}
</style>
<body>
<p><span>第一个文本<span></p>
<div><span>第二个文本<span></div>
</body>
</html>
给里面盒子一个宽度然后通过margin:auto让他居中举例
<div style="float:leftwidth:50%">第一个盒子(左)
<div style="width:50pxheight:30pxmargin:auto">里面的盒子</div>
</div>
<div style="float:rightwidth:50%">第二个盒子(右)</div>