HTML – 我希望这个标签到达图像的底部?
发布时间:2020-12-14 18:55:11 所属栏目:资源 来源:网络整理
导读:我对这个html / css完全不熟悉我试图将带有背景的文本浮动为图像.是的我做了但是问题是文本浮动在图像上.如果使用margin-top来调整图像,它只是简单地拉下整个div.Here down我给了我想要的图形表示. HTML div class="maincon" div class="picon" style="backg
我对这个html / css完全不熟悉我试图将带有背景的文本浮动为图像.是的我做了但是问题是文本浮动在图像上.如果使用margin-top来调整图像,它只是简单地拉下整个div.Here down我给了我想要的图形表示.
HTML <div class="maincon"> <div class="picon" style="background-image: linear-gradient(to bottom,rgba(0,.02),.8)),url('img/apple.jpg') "><p>Hi</p> </div> </div> CSS .maincon { margin-top: 95px; width: 80%; margin-left: auto; margin-right: auto; height: 100%; } .picon { width: 100%; height: 80%; background: none center/cover #f2f2f2; } .picon p { } 解决方法
绝对位置绝对和相对.你可以使用flexbox module.it支持所有最新的浏览器.
.element { height: 80vh; background: linear-gradient(to bottom,url('http://cdn2.macworld.co.uk/cmsdata/features/3598128/iphone_6s_review_20.jpg'); background-size: cover; align-items: flex-end; display: flex; } p { color: white; font-size: 25px; margin: 10px; } <div class="element"> <p>Apple iphone</p> </div> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |