gpt4 book ai didi

html - 在 2 列文本之间 float 图像

转载 作者:可可西里 更新时间:2023-11-01 13:16:33 24 4
gpt4 key购买 nike

我想知道是否有可能在 CSS/HTML 中重现您在这本杂志中看到的效果,图像漂浮在两列文本之间,文本环绕着它:

Floated Image

我知道只有现代浏览器支持两列布局,所以我的问题是:

  1. 这可以在现代浏览器中完成吗?如果是这样,如何?我们本质上是在做一个“float:both”,但是那个指令不存在....
  2. 是否有任何向后兼容的 hack 可以在旧版浏览器中做到这一点?

最后,如果你可以在 HTML/CSS 中做到这一点,我认为图像仍然必须是方形的,这样环绕效果就不会像这里那样自然。是否有可能准确地重现效果,而不是让图像正方形带有空白,例如,在 Ron Paul 头部的左侧和右侧?您是否必须将图像切片才能完成?

最佳答案

这并不容易实现(尤其是对于动态文本)。所有技术都有各种缺点。

这是“ float 中心”的一种可能技术:

http://css-tricks.com/9048-float-center/

对于 modern browsers ,有一个 jQuery 插件可以做到这一点 precisely :

http://www.jwf.us/projects/jQSlickWrap/

这是启发上述 jQuery 插件的繁琐的手动版本:

http://www.alistapart.com/articles/sandbags

关于html - 在 2 列文本之间 float 图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7588302/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com