Question

我正在尝试在div“text”下更改图像的边距，但它没有检测到任何样式。我不知道我做错了什么。请指教。

这是HTML

 <div class="text">
    <h2> <img src="/static/meddy1/images/ad.png" alt ="Ads"><a href="/docprofile/{{doc.id}}/">{{doc.name}}</a></h2>
    <h3 id="gray" style="margin-top: -10px;"> {{doc.clinic.address_normal}}</h3>
 </div>

这是CSS

.text {
    margin-top: 0px;
    border: 1px solid;
    border-color: #C0C0C0;
    height: 150px;
    margin-left: 10px;
    text-indent: 10px;
}

.text > img {
    margin-top: 2px;
}

Answer 1

嗨，我不是css专家，但.text＆gt; img意味着.text的直接孩子，事实并非如此。你的代码是.text＆gt; h2＆gt; IMG。

Answer 2

.text > img正在寻找一个小孩，但你的形象是第二个级别的孩子。

尝试.text > h2 > img或.text img - 请注意，如果您的.text元素中有其他图片，则第二个可能会导致问题。

Answer 3

问题在于＆＃34;＆gt;＆＃34;表示直接子项，而您的DOM显示图像实际上是文本下面的h2元素的子项。因此，要修复它，您应该使用后代选择器：

.text img

简而言之＆＃34; x＆gt; ý＆＃34;意味着选择＆＃34; y＆＃34;直接父母为＆＃34; x＆＃34;，而＆＃34; x y＆＃34;意味着选择＆＃34; y＆＃34;如果它有一个匹配＆＃34; x＆＃34;。

的祖先（在任何级别）

无法在css中设置图像样式

3 个答案: