单击复选框时如何显示标记

Question

<h3>单击复选框时如何显示此标记？现在它被隐藏了.

<h3 class="bark">Bark Bark</h3>
<input type="checkbox" class="title">Hear a dog</input>

CSS:

.bark{ 
  visibility: hidden
}

input[type="checkbox"]:checked  {
visibility: visible  
}

Answer 1

.bark{ 
  visibility: hidden
}

input[type="checkbox"]:checked + h3.bark  {
visibility: visible  
}

<input type="checkbox" class="title">Hear a dog</input>
<h3 class="bark">Bark Bark</h3>

Answer 2

超文本标记语言

<h3 class="bark" id="bark" onclick="showtag()">Bark Bark</h3>
<input type="checkbox" class="title">Hear a dog</input>

脚本语言

<script language="javascript">
    function showtag() {
        var showme = document.getelementbyid("bark");
        showme.style.visibility = "visible";
    }
</script>