CSS鼠标移上去给元素加边框。后面元素移动的原因,是处于hover状态的div添加的边框导致div大小发生变化。这里涉及到div的盒子模型,即一个div的大小是等于content+padding+border+margin。详细可百度div盒子模型。
知道原因就知道了解决办法,两种方法:
第一种方法:让鼠标hover时改变div的width和height只需减去边框大小,这样div的大小就没有发生改变。
第二种方法:使用box-sizing属性改变div盒子模型的规则。 详情查看:http://www.w3school.com.cn/cssref/pr_box-sizing.asp