Question

我需要在特定ID下定位多个元素和类。注意：我必须指定ID。这些类将与其他ID一起使用

#block-views-now-playing2-block .poster1 img
{
   width:auto;
   height:400px;    
}

#block-views-now-playing2-block .poster1 div
{
   width:263px;
   height:400px;
   overflow:hidden;
}

在此示例中，img元素接受css。 div没有，CSS被忽略。为什么呢？

HTML：

<div class="block block-views contextual-links-region last even" id="block-views-now-playing2-block">
   <div class="field-content poster1">
      <img src="http://mysite/myposter.jpg">
   </div>
</div>

Answer 1

在CSS选择器前面添加ID不会影响如何选择，而是 where 。当您从#block-views-now-playing2-block开始时，您正在限制所需内容的范围#block-views-now-playing2-block

所以#block-views-now-playing2-block .poster1 img读取：“查找内部存在的任何img和内容poster1的元素，该类存在于ID为block-views-now-playing2-block”的元素内。

对于div示例，它的工作方式相同。

要让CSS找到某些东西，html需要像这样构建：

<div id="block-views-now-playing2-block">
  <div class="poster1">
    <img/>
  </div>
</div>

如果您要将CSS更改为#block-views-now-playing2-block.poster1 img（请注意缺少的空间）。 CSS会显示：“ID为img且类为block-views-now-playing2-block.poster1的元素内的任何poster1”如果HTML的结构类似于：

<div id="block-views-now-playing2-block" class="poster1">
  <div>
    <img/>
  </div>
</div>

（请注意，班级使用ID向上移动了一个级别）

但实际上我只能猜到为什么在没有看到HTML的情况下它不适合你。

ID下的CSS类

1 个答案: