Question

我正在尝试将所有图像宽度设置为100％存在于名为“res”的div中。这是我使用的代码，但它不适用于移动设备。任何人都可以建议我更好的代码。

为了更加清晰，请查看page

PHP代码

<?php
      echo '<div class="res"><img src="image.jpg" /></div>';
?>

CSS代码

div.res>img
{
    width:100%;
    height:auto;
}

HTML CODE

<body>
<?php require 'test.php'; ?>
</body>

Answer 1

您的代码存在一些问题，这是我在您的网页上看到的标记：

<div class="res">
    <h3>
        <img src="image.jpeg" style="width: 576.766px; height: 384.532px;">
    </h3>
</div>

图片代码嵌入在h3标记中，这意味着您的css选择器.res>img {}无法正常工作。您在此处定位.res div的直接子img标记，并非所有该div中包含的img标记。你想要做的是使用像.res img {}

这样的选择器

其次，您在img标记中使用的内嵌样式位于css之前，这意味着在这种情况下您的css样式表将被忽略。

总而言之，以下是解决问题的步骤：