css里边框与边界的区别？

html-css016

css里边框与边界的区别？,第1张

你把这个按钮理解成一个盒子，按钮上的字理解成盒子里的物品，那么：

边界（margin）是盒子相对于外界的距离，比如和另一个盒子的距离，又叫外边距

填充（padding）是盒子内的物品跟盒子之间的距离，又叫内边距

边框（border）是盒子的边，属于盒子的一部分

直接用css属性值设置边线：border即可，还可以单独设置border-left，right，bottom，top。

用ccs3中的盒阴影设置，是一种固定写法： box-shadow：1px 1px red,inset 1px 1px red.

使用outline+outline-offset实现多重边框

如果我们只需要绘制两层边框，使用outline也可以做到。outline是border外面的一层，和border原理一样。通过设定outline的样式可以为border外面再设定一层边框。但是需要注意的是，outline属性设定的边框不会随着内部元素边界样式的变化而变化。也就是说，如果元素边框带了圆角，那么outline绘制出的最外层边框仍然是矩形的。这是outline绘制边框的一个缺憾。