CSS中让文字在底部的效果怎么做的
Admin 2022-05-28 群英技术资讯 3762 次浏览
css将文字放在div的底部方法:1、利用position属性,将div元素设置为相对定位,将文字元素设置为绝对定位;2、利用bottom属性将文字放在div的底部,只需要给文字元素添加“bottom:0;”样式即可。
本教程操作环境:windows10系统、CSS3&&HTML5版、Dell G3电脑。
css如何将文字放在div的底部
在css中,可以使用定位属性position来设置文字的位置,实现文字在div的底部。下面举例讲解css中怎么让div里面的文字底部显示。
示例如下:
1、新建一个html文件,命名为test.html,用于讲解css中怎么让div里面的文字底部对齐。使用div创建一个模块,并使用p标签创建一段文字。给div标签添加一个class属性,用于设置div和p标签的样式。
在css标签内,通过class设置div的样式,定义其宽度为250px,高度为400px,背景颜色为灰色,并使用position属性设置div为相对定位。
2、在css标签内,再设置p标签的样式,使用position属性设置p标签为绝对定位,并使用bottom属性设置p标签文字在底部,同时设置p标签宽度为100%,使用text-align属性让文字居中对齐。
在浏览器打开test.html文件,查看实现的效果。
总结:
1、在div内,使用p标签创建一行文字。
2、在css中,使用position属性设置div为绝对定位,p标签为相对定位,通过bottom属性让文字在div的底部对齐。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
在css3中,可用animation-play-state属性来让运行的animation动画停止,该属性的作用就是规定动画正在运行还是暂停,只需要给应用了动画的元素添加“animation-play-state:paused;”样式即可。
本篇文章主要为大家讲述的技术关于draggable属性实现页面拖动的效果,往下读下去,一步步的你会发现这个其实也不是很难,现在让我们一起来看这篇文章吧
学习css的朋友应该都有听过css选择符,css选择符就是指要修改的元素,比较常用的选择符是,标签选择符,类选择符,ID选择符等等。其实ccs选择符是有利于提高代码质量的,下面我们一起深入了解css选择符。
这篇文章主要介绍了运用CSS methodologies去实现模块化的方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
这篇文章主要介绍了给原生html中添加水印遮罩层的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008