我想在自己的类中应用带焦点选择器的css。我只是不想隐藏自己的焦点。这是我的代码段。
body {
display: block;
}
.span3:focus ~ .alert {
display: none;
}
.span2:focus ~ .alert {
display: block;
}
<span class="span3" tabindex="0">Hide Me</span>
<span class="span2" tabindex="0">Show Me</span>
<p class="alert">Some alarming information here</p>
答案 0 :(得分:0)
我认为这是你问题的答案,你应该使用javascript。一个小脚本,删除一些css行。
https://jsfiddle.net/prsebqg3/
html文件
C:\Users\Anil>java -version
java version "1.8.0_91"
Java(TM) SE Runtime Environment (build 1.8.0_91-b15)
Java HotSpot(TM) 64-Bit Server VM (build 25.91-b15, mixed mode)
css文件
<span id="span3" tabindex="0">Hide Me</span>
<span id="span2" tabindex="0">Show Me</span>
<p id="alert" >Some alarming information here</p>
<script>
document.getElementById("span3").onclick = function() {functionHide()};
function functionHide() {
document.getElementById("span2").style.display = "block";
document.getElementById("span3").style.display = "none";
document.getElementById("alert").style.display = "none";
}
document.getElementById("span2").onclick = function() {functionShow()};
function functionShow() {
document.getElementById("span2").style.display = "none";
document.getElementById("span3").style.display = "block";
document.getElementById("alert").style.display = "block";
}
</scrip>