不使用Javascript更改自定义CSS属性?

Jac*_*ges 0 html css pseudo-class css3

所以我正在做一些wiki编辑,遗憾的是Javascript没有启用.因此,我需要CSS大师的帮助!

我知道您可以添加如下自定义HTML属性:

<span id="some-id" custom_attr="no"></span>
Run Code Online (Sandbox Code Playgroud)

你可以用custom_attr这样的样式元素:

span[custom_attrib] { /* styling here */ }
Run Code Online (Sandbox Code Playgroud)

现在,有没有办法在CSS中编辑HTML属性?

示例(当然不起作用..):

<!------------- CSS ------------>
<style>
  .some-class {
    /* Original code here */
  }
  .some-class[custom_attr = "yes"] {
    /* Change code here */
  }

  #some-id:hover ~ .some-class[custom_attr = "no"] {
    custom_attr : "yes";
  }
</style>

<!------------- HTML ------------>
<html>
...
<span id="some-id">...</span>
<span class="some-class" custom_attr="no">...</span>
...
</html>
Run Code Online (Sandbox Code Playgroud)

Mat*_*ant 7

当然你可以用CSS编辑HTML!

从您的示例代码中,当用户hovers在其上时,您似乎想要将"否"更改为"是" .这是如何做:

http://jsfiddle.net/ENZQU/

<a default="YES" mouseover="NO"></a>

a {
    font-size: 3em;
}
a:after {
    content: attr(default);
}
a:hover:after {
    content: attr(mouseover);    
}
Run Code Online (Sandbox Code Playgroud)

你想要它click吗?简单!

http://jsfiddle.net/ENZQU/1/

<input id="cbox" type="checkbox">
<label for="cbox"></label>

#cbox {
    display: none;
}
label {
    font-size: 3em;
}
label:after {
    content: "YES"
}
#cbox:checked + label:after {
    content: "NO"
}
Run Code Online (Sandbox Code Playgroud)

我强烈建议你找到另一种方法来做到这一点.维基不希望您动态地更改页面上的内容,并且可能是出于某种原因而构建的.