html - 关于图像包装的建议？

Question

我正在尝试做 a floating design，但是当我调整浏览器的大小时，<p>标签旁边的<img>标签开始布局成一列，而不是在图像下方。你可以在这里看到代码 -> http://funkz.nfshost.com/ 它在“**main-bottom-post**" ID . 我也搜索过网络，但大多数文章都是相反的 - 在img旁边制作一个专栏。在此先感谢， MK

Answer 1

在 css 中试试这个：display:inline-block当你调整浏览器的大小时，你会成功

Answer 2

当您希望在图像下移动并在其上应用 a时，您将不得不使用媒体查询来定位特定的分辨率。<p class="post-text">float: left;

例如 ：

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
    p.post-text {
        float: left;
    }
}

这将使您<p class="post-text">在图像下方浮动，屏幕宽度介于480px和320px之间。

您可能还想查看此内容以获取更多参考。

Answer 3

尝试给予position财产。

或尝试media queries

@media screen and (min-width: xxpx) {
   div {width: xxpx;}
 }

试试这个链接

http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

http://www.danstorm.com/dan-storm-article-css-15.html