关于悬浮加边

HTML基础顾兴福 •

文章标签: 盒子模型

我们做前端经常会遇到悬浮给盒子加边框操作，当一排有很多盒子的时候悬浮加边框就会挤动旁边的盒子。

我总结了一下我自己知道的能解决，悬浮加边框挤动旁边盒子的方法。

1. 悬浮的时候减少盒子的宽高，效果如下。

图片1.png

2. 先设好一个透明的边框，再悬浮的时候就不会挤动了，效果如下。

图片2.png

3. box-sizing: border-box;这个属性会把边框加到盒子内部，它的初始值是box-sizing: content-box;

欢迎补充。