CSS：样式元素标题，但仅具有特定属性

Question

我在标题中有一个链接需要根据数据属性设置样式：

<header id="header" data-ma-theme="white">
    <ul>
        <li>
            <a href="#">Whatever</a>
        </li>
    </ul>
</header>

我希望

<a>

标签在标头具有 data-attrbute-skin="white" 时具有深色。

我试过：

header > ul > li > a[data-ma-theme="white"] {
    color: #333;
}

header ul li a[data-ma-theme="white"] {
    color: #333;
}

header > a[data-ma-theme="white"] {
    color: #333;
}

header a[data-ma-theme="white"] {
    color: #333;
}

#header a[data-ma-theme="white"] {
    color: #333;
}

等等。它们似乎都不起作用。我也试过！重要的，不工作。浏览器中的 Inspector 并不表示发现了上述任何规则。

关于我做错了什么的想法？