文字居于div底部的方式 |
您所在的位置：网站首页 › css文字右对齐代码 › 文字居于div底部的方式 |
|
CSS中的text-align属性只能控制文字在水平方向的左对齐（left），右对齐（right），居中（center）,控制不了垂直方向的文字位置，对此有以下解决方案 在div内部塞占位符标签，把文字挤到下方(不推荐) 我是祖父: 下面是爸爸 .div { height: 100px; } .place { height: 70px; }不推荐这种方法是因为会增加占位标签，基于剃刀原理“如无必要，勿增实体”，所以放弃这种。 修改行高line-height属性 我是祖父: 下面是爸爸 .div { height: 100px; line-height: 170px; }通常行高设置为元素高度的170%合适 使用相对定位控制父元素设置position: relative，文字元素设置position: absolute,并用上下左右四个属性控制文字位置,设置bottom:0 即可文字局底。 我是祖父: 下面是爸爸 .div { height: 100px; background-color: aquamarine; position: relative; text-align: center; } .div p{ position: absolute; bottom: 0px; padding: 0; margin: 0; } |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |