鼠标悬停显示弹框：HTML、CSS 和 JavaScript 实现

#box {
  width: 100px;
  height: 100px;
  background-color: #ccc;
  text-align: center;
  line-height: 100px;
}

#popup {
  display: none;
  position: absolute;
  top: 120px;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  height: 100px;
  background-color: #fff;
  border: 1px solid #ccc;
  text-align: center;
  line-height: 100px;
}

var box = document.getElementById('box');
var popup = document.getElementById('popup');

box.onmouseover = function() {
  popup.style.display = 'block';
}

box.onmouseout = function() {
  popup.style.display = 'none';
}

解释：

1. HTML中有两个div，一个是id为'box'，另一个是id为'popup'；
2. CSS中设置了'box'的样式和'popup'的样式，'popup'的display属性设置为none，即一开始不显示；
3. JavaScript中获取了'box'和'popup'的元素，并分别绑定了鼠标移入和移出事件；
4. 当鼠标移入'box'时，'popup'的display属性设置为block，即显示出来；
5. 当鼠标移出'box'时，'popup'的display属性设置为none，即隐藏起来。