绝对定位的位置问题
为什么设置绝对定位和bottom:0之后，
标签却不在父元素的底部？之后加了margin:0后才可以？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
.is{position: relative;width: 480px;}
.childs{background-color: orangered;height: 200px;}
.is .title{position: absolute;bottom:0;width: 100%;line-height: 45px;background-color: #000;opacity: 0.7;}
.is .title a{margin-left: 20px;color: #fff;text-decoration: none;}
</style>
</head>
<body>
<div class="is">
<div class="childs">去哪儿</div>
<p class="title"><a href="#">视线</a></p>
</div>
</body>
</html>
展开
收起
1
条回答
写回答
写回答
-
IT从业p标签在浏览器环境下默认带有margin属性，而绝对定位并不影响margin值起作用。
可以看一下这篇文章：浅谈块元素绝对定位的margin属性刚开始学习css布局的时候，先上手熟悉浏览器的开发者工具，比如chrome浏览器自带的，或者火狐浏览器的Firebug。Window下F12或Mac下option＋command＋i调出。通过开发者工具，自己就能学着分析碰到的百分之八九十的布局问题了……强烈建议！
2019-07-17 19:30:27赞同 展开评论 打赏
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
相关问答
问答排行榜
最热
最新
推荐问答
