首页 > 编程开发 > CSS    日期:2020-12-21 / 来自互联网 / 浏览

css怎么让文字在底部对齐

css让文字在底部对齐的方法:

方法1:

创建HTML元素

<div>文字在div的底部对齐</div>

添加css样式

div{
    width:200px;height:50px;  /*设置div的大小*/
    border:4px solid #beceeb; /*为了便于观察,显示出边框*/
    display:table-cell; 
    vertical-align:bottom;
  }

css怎么让文字在底部对齐

方法2:

使用div创建一个模块,并使用p标签创建一段文字。给div标签添加一个class属性,用于设置div和p标签的样式。

css怎么让文字在底部对齐

在css标签内,通过class设置div的样式,定义其宽度为250px,高度为400px,背景颜色为灰色,并使用position属性设置div为相对定位。

css怎么让文字在底部对齐

再设置p标签的样式,使用position属性设置p标签为绝对定位,并使用bottom属性设置p标签文字在底部,同时设置p标签宽度为100%,使用text-align属性让文字居中对齐。

css怎么让文字在底部对齐

在浏览器打开test.html文件,查看实现的效果。

css怎么让文字在底部对齐

觉得上面的内容有用吗?快来点个赞吧!

点赞() 我要打赏

温馨提示 : 本站内容来自会员投稿以及互联网,所有源码及教程均为作者总结编辑,请大家在使用过程中提前做好备份,以免发生无法预知的错误,源码类教程请勿直接用于生产环境!

 可能感兴趣的文章

1 2 3 4 5