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)
当然你可以用CSS编辑HTML!
从您的示例代码中,当用户hovers在其上时,您似乎想要将"否"更改为"是" .这是如何做:
<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吗?简单!
<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)
我强烈建议你找到另一种方法来做到这一点.维基不希望您动态地更改页面上的内容,并且可能是出于某种原因而构建的.
| 归档时间: |
|
| 查看次数: |
3789 次 |
| 最近记录: |