Css 使用：target选择器影响不相关的DIV（没有Javascript）？

是否可以使用

：target

CSS选择器影响另一个DIV？例如，当用户访问

http://website.com/#button

如果.photo元素的结构如下所示，您能为其设置样式吗

<div class="gallery">
  <ul>
   <li class="photo">
   <li class="photo">
  </ul>
<div>
<div id="button">Button Text</div>

按钮文本

：target

检查url的哈希部分，并在元素上查找匹配的

id

。因此，可以影响另一个元素，但它需要一个与当前哈希部分匹配的

id

。下面是一个示例：target检查url的哈希部分，并在元素上查找匹配的

id

。因此，可以影响另一个元素，但它需要一个与当前哈希部分匹配的

id

。下面是一个示例

您可以影响多个元素，但它们都必须与目标元素相关。最简单的方法是将

id

放在包装器元素上：

<div id="gallery1">
    <div class="gallery">
      <ul>
          <li class="photo">Photo</li>
          <li class="photo">Photo</li>
      </ul>
    </div>
</div>
<div id="gallery2">
    <div class="gallery">
      <ul>
          <li class="photo">Photo</li>
          <li class="photo">Photo</li>
      </ul>
    </div>
</div>
<a href="#gallery1">Gallery 1</a>|<a href="#gallery2">Gallery 2</a>

---

.

您可以影响多个元素，但它们都必须与目标元素相关。最简单的方法是将

id

放在包装器元素上：

<div id="gallery1">
    <div class="gallery">
      <ul>
          <li class="photo">Photo</li>
          <li class="photo">Photo</li>
      </ul>
    </div>
</div>
<div id="gallery2">
    <div class="gallery">
      <ul>
          <li class="photo">Photo</li>
          <li class="photo">Photo</li>
      </ul>
    </div>
</div>
<a href="#gallery1">Gallery 1</a>|<a href="#gallery2">Gallery 2</a>

---

.

谢谢您的快速回复！如果我在维护功能的同时尝试为本例中的锚元素创建活动（或者更确切地说是“选定”）状态，会怎么样？您希望能够同时选择多个元素吗？我不认为这可以在纯CSS中完成。好吧，我只需要选择一个元素。我本来希望某种组合器能做到这一点，但一直无法实现。谢谢你的快速回复！如果我在维护功能的同时尝试为本例中的锚元素创建活动（或者更确切地说是“选定”）状态，会怎么样？您希望能够同时选择多个元素吗？我不认为这可以在纯CSS中完成。好吧，我只需要选择一个元素。我本来希望某种组合器能起到作用，但一直没能起作用。你通常可以，但在这种情况下你不能，因为

#按钮

在

.gallery

之后，你不能用同级选择器向后走。你通常可以，但在这种情况下，您不能这样做，因为

#按钮

位于

.gallery

之后，并且您不能使用同级选择器后退。