Question

只是想知道是否可以在不使用javascript的情况下调用div。

，例如

my_div:hover{ add new layout}

是否有点击的版本，例如

my_div:click{add new layout}

由于

Answer 1

是的，如果你向你的div添加tabindex="0"，你可以点击它，然后可以使用:focus伪类来应用样式。

<div class="clickable" tabindex="0"></div>

.clickable {
  height: 100px;
  background: blue;
}

.clickable:focus {
  background: red;
}

Codepen example。单击div应该给它焦点并应用：focus CSS to it。单击它将使其失焦（模糊）并重置默认样式。

Answer 2

不是直接的，但您可以使用复选框伪造它：

＆＃13;

input[type=checkbox] {
  display: none;
}
.content {
  display: none;
  padding: 20px;
  background-color: #dadada;
}
input[type=checkbox]:checked+label+.content {
  display: block;
}

＆＃13;

<input type="checkbox" id="check">
<label for="check">Click me</label>
<div class="content">
  <h3>Content</h3>
  <p>lorem20</p>
</div>

＆＃13;

是否可以在没有javascript的情况下点击激活div？

2 个答案: