1.实现CSS文字底部对齐
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>CSS实现文字底部对齐</title>
<style type="text/css">
#txt{
height:246px;
width:512px;
border:1px solid #000000;
position:relative
}
#txt p{
position:absolute;
bottom:0px;
padding:0px;
margin:0px
}
</style>
</head>
<body>
<div id="txt">
<p><a href="#" target="_blank">网页特效</a></p>
</div>
</body>
</html>
2.文字在块内的垂直对齐,内容高度不固定,容器高度固定
<div class="cont">
<div class="inner">比较满意比较满意比较满意</div><div class="v">cssHack</div>
</div>
* {
margin: 0;
padding: 0;
}
.cont {
background-color: #ccc;
font-size: 24px;
height: 150px;
text-align: center;
overflow: hidden;
width: 280px;
}
.cont .inner,
.cont .v {
display: inline-block;
zoom: 1;*display: inline; /* 用于触发支持IE67 inline-block */
}
.cont .inner {
line-height: 1.8;
padding: 0 4px 0 5px;
vertical-align: middle;
width: 262px;
}
.cont .v {
line-height: 150px;
text-indent:-9999px;
width: 1px;
}
参考地址:http://uecss.com/css-vertical-center.html