css一个框跟随鼠标

CSS是一种用于网页布局和样式的编程语言。我们可以利用CSS为网页添加不同的效果，比如说当我们想要在鼠标移动到一个框上的时候，使得该框能够跟随着鼠标移动，那么我们可以使用CSS来实现。

.Box{
  position: absolute; /*绝对定位*/
  width: 50px;
  height: 50px;
  background-color: red;
  margin-left: -25px; /*让框跟随鼠标居中*/
  margin-top: -25px;
  border-radius: 50%; /*圆形*/
}

/*鼠标移动事件*/
document.addEventListener('mousemove',function(event) {
  var x = event.clientX;
  var y = event.clientY;

  var Box = document.querySelector('.Box');
  Box.style.left = x + 'px';
  Box.style.top = y + 'px';
})

在这段代码中，我们首先定义了一个`.Box`类，其样式包括绝对定位、一个红色、圆形的框，并且将其`margin-left`和`margin-top`的值设为`-25px`，以便于将框居中显示在鼠标位置。

然后我们使用了一个鼠标移动的事件，监听鼠标的位置，并将框的位置设为跟随鼠标的位置。

如果我们想要添加鼠标点击事件，可以继续加入如下代码：

/*鼠标点击事件*/
document.addEventListener('click',function(event) {
  var Box = document.querySelector('.Box');
  Box.style.backgroundColor = 'blue';
})

当鼠标点击框的时候，将框的背景颜色变为蓝色。

通过CSS和JavaScript的配合，我们顺利实现了让网页上的一个框跟随着鼠标移动并且点击后会更换背景颜色的效果。这也展示出了CSS和JavaScript的强大引力。