1
2
display:table-cell
/*按照单元格的样式显示元素*/
vertical-align:bottom
/*底对齐*/
举个例子:
创建html元素
1
文字在div的底部对齐
添加css样式
1
2
3
4
5
div{
width:200pxheight:50px
/*设置div的大小*/
border:4px
solid
#beceeb
/*为了便于观察,显示出边框*/
display:table-cell
vertical-align:bottom
显示效果
两个div都设置为display:inline-block这样可能会出现两个div顶端不对齐的情况,可以在右侧div设置vertical-align:
top
*
{
margin:
0
padding:0}
.left
{
display:
inline-block
}
.right
{
display:
inline-block
vertical-align:
top
//与左侧div顶部对齐
}