CSS好代码教程:DIV底部放置文字

这是一篇很有收藏价值的文章《CSS好代码教程:DIV底部放置文字》,在开发过程对大家很有帮助,小编结合实例代码给大家介绍的非常详细,需要的朋友可以参考下

  css对文字的布局上没有靠容器底部对齐的参数,目前使用的一个不错的方法也比较好.就是用position属性来解决,看下面的代码,用position的相对和绝对定位功能也轻松的实现了,文字靠近div低部对齐,并且靠近的距离还可以精确到像素,自己可以调节,是不是很不错呢?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<style type="text/css">
#txt{
height:300px;
width:300px;
border:1px solid #333333;
text-align:center;
position:relative
}
#txt p{
position:absolute;
bottom:0px;
padding:0px;
margin:0px
}
</style>
</head>
<body>
<div id=txt>
<p>aadsad</p>
</div>
</body>
</html>

到此这篇关于CSS好代码教程:DIV底部放置文字就介绍到这了。一个人,想要优秀,你必须要接受挑战;一个人,你想要尽快优秀,就要去寻找挑战。世界上,成功的有两种人,一种人是傻瓜,一种人是疯子。傻瓜是会吃亏的人,疯子是会行动的人。更多相关CSS好代码教程:DIV底部放置文字内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!

您可能有感兴趣的文章
css让页脚保持在底部位置的四种方案

Flex布局史上最简单使用语法教程

新的CSS 伪类函数 :is() 和 :where()示例详解

纯CSS打字动画的如何实现示例

CSS浮动引起的高度塌陷问题