很多属性我们会正常的使用，但是我们很少去探究这个属性使用的异常情况，以及如何更加准确的使用这些属性来达到效果。今天我们就来学习一下css属性border和outline。
1、outline
- （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用；
- 轮廓线不会占据空间，也不一定是矩形；
outline-style是必须要写的，且只能为一个值；outline-color没有时，outline-color取字体颜色；- 不显示outline
outline-style: none;、outline-color: transparent;或outline-width: 0;。
outline的使用
2、border
- 简写属性在一个声明设置所有的边框属性；
- 会占据空间；
border-style是必须要写的，可以为多个值；border-color没有时，border-color取字体颜色；- 不显示border
border-style: none/hidden;。
border的使用
3、outline + border
效果会叠加显示。一定要多用浏览器调试，多测试。
outline + border的显示
网友评论