大佬教程收集整理的这篇文章主要介绍了环绕绝对位置div的文字环绕,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
绝对定位使该元素脱离正常的文档流,因此它不会与其他元素交互。也许您应该改用float来放置它,然后在Stack Overflow上询问它是否卡住:)
我知道有关类似主题的一些问题,但它们大部分相当于浮动div
/图像。我需要将图像(和div)放置在绝对位置(向右偏移),但我只希望文本围绕它流动。如果我将div浮动,则可以使用,但是无法将其放置在所需的位置。因为它是文字,只是在图片后面流动。
<div class="post">
<div class="picture">
<a href="/user/1" title="View user profile."><img src="http://www.neatktp.com/sites/default/files/photos/BlankPortrait.jpg" alt="neatktp's picture" title="neatktp's picture" /></a></div>
<span class='print-link'></span><p>BlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlah.</p>
<p>BlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlahBlah.</p>
</div>
是HTML的示例
随着CSS是:
.picture img {
background: #fff;
border: 1px #ddd solid;
padding: 2px;
float: right;
}
.post .picture {
display: block;
height: auto;
position: absolute;
right: -10px;
top: -10px;
width: auto;
}
.post {
border: 1px solid #FFF;
border-bottom: 1px solid #e8ebec;
padding: 37px 22px 11px;
position: relative;
z-index: 4;
}
这是一个Drupal主题,所以这些代码都不是我的,只是在将图片放在那里时,它并没有完全起作用。
以上是大佬教程为你收集整理的环绕绝对位置div的文字环绕全部内容,希望文章能够帮你解决环绕绝对位置div的文字环绕所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。