在 CSS 中使用 :target 作为数据属性

【问题标题】：Using :target for data attribute in CSS在 CSS 中使用 :target 作为数据属性
【发布时间】：2017-03-15 07:50:59
【问题描述】：

我有一个锚点，它使用数据属性链接到一个元素，在定位时需要特殊样式。

我的逻辑

span[data-anchor="my-data"]:target {
    /* styles */
}

<a href="#my-data">anchor</a>

<span data-anchor="my-data">My Data</span>

我正在使用 Shortcodes Ultimate (WP) https://gndev.info/shortcodes-ultimate/

【问题讨论】：

【解决方案1】：

:target 作用于当前活动的锚点它真的不需要选择器

试试这样的：

html:

<a href="#my-data">anchor</a>
<span id="my-data">My Data</span>

css:

:target {
    background-color: red;
}

在这里查看一个工作示例- https://jsfiddle.net/0fkh8n09/

【讨论】：