html - 从右侧出现在 div 后面的按钮 - CSS

Question

我写这段代码是为了让一个按钮从右边出现在 div 后面，但是当我悬停按钮本身时它不起作用(#appear)

#main{
  height:20px;
  width:200px;
  background-color:#c1c1c1;
  position:relative;
}
#appear{
  position:absolute;
  right:0;
  width:20px;
  height:20px;
  background-color:red;
  z-index:-100;
}
#main:hover #appear,#appear:hover{
  right:-20px;
}

<div id="main">
  <div id="appear">
  </div>
</div>

Answer 1

不要使用 hover，而是使用 javascript 事件，例如 onmouseenter。只有将鼠标指针放在元素上时，悬停才会生效。访问此链接了解更多信息: JSEvents