如何包装文本浮动，固定图像？ [英] How to wrap text around floating, fixed image?
问题描述
我有一个浮动在右下角的图像（放在按钮，位置必须固定）。但是，我的页面上的文本的一部分消失在图像的后面。是否可以让此文字包围我的图片？
< html xmlns =http：//www.w3。 org / 1999 / xhtml>
< head>
< / head>
< body>
< img src ='http：//upload.wikimedia.org/wikipedia/commons/e/ec/Happy_smiley_face.png'
style ='float：right;
position：fixed;
right：50px;
bottom：50px;
width：20％'>
文本放在这里
< / body>
< / html>
您可以在此操作中看到问题示例页面。
单独。
图像浮动的事实在这里没有帮助，因为它也是固定的。因此，它不再是流的一部分，文本不响应它。
这不能由CSS单独修复。你可以使用Javascript修复它，通过在滚动时移动图像，但它将很难正确，它会严重减慢滚动通过您的页面，因为文本将必须在每次移动后重新对齐。 p>
我想你最好注意一个不同的解决方案。
I've got an image that floats in the bottom right corner (to put in the button, the position has to be fixed). However, part of the text on my page disappears behind the image. Is it possible to make this text wrap around my image?
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<img src='http://upload.wikimedia.org/wikipedia/commons/e/ec/Happy_smiley_face.png'
style='float:right;
position: fixed;
right:50px;
bottom:50px;
width:20%'>
Text is placed here
</body>
</html>
You can see the problem in action on this example page.
No, not in CSS alone.
The fact that the image is floated doesn't help here, because it is also fixed. Therefor it is not part of the flow anymore and the text doesn't respond to it.
This cannot be fixed by CSS alone. You could fix it using Javascript by moving the image around as you scroll, but it will be hard to get right and it will seriously slow down scrolling through your page, since the text will have to be re-aligned after each movement.
I think you'd better look out for a different solution.
这篇关于如何包装文本浮动，固定图像？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
