outline属性用于在元素边框外绘制轮廓线，不影响布局；2. 语法为outline: [style] [width] [color]，常用样式包括solid、dashed；3. 配合outline-offset可设置轮廓偏移距离；4. 常用于焦点状态以提升可访问性，不应完全移除focus轮廓。
在css中，outline 属性用于在元素的边框外围绘制一条轮廓线，它不会占据文档流空间，因此不会影响元素的尺寸或页面布局。与 border 不同，outline 是绘制在边框之外的“额外”线条，常用于可访问性（如聚焦状态）或视觉强调。
基本语法
outline 属性可以设置轮廓的颜色、样式和宽度，语法如下：
outline: [color] [style] [width];
三个值的顺序可以任意，但通常推荐按 style、width、color 的顺序书写。
常用属性值说明
- outline-style：轮廓的样式，常用值有 solid（实线）、dashed（虚线）、dotted（点线）、none（无轮廓）等。
- outline-width：轮廓的宽度，可选值如 thin、medium、thick 或具体像素值（如 2px）。
- outline-color：轮廓的颜色，可以是任何合法的颜色值，如 red、#ff0000 或 rgba(255,0,0,0.5)。
实际使用示例
以下是一个按钮在获得焦点时显示蓝色外部轮廓的例子：
立即学习“前端免费学习笔记（深入）”；
button:focus {
outline: 3px solid blue;
outline-offset: 2px; /* 控制轮廓与边框的距离 */
}
outline-offset 是一个关键属性，用来设置轮廓线距离元素边框的间距。正值表示向外偏移，负值则向内（可能重叠边框）。
注意事项
- outline 不是边框，不会影响元素的大小或位置。
- outline 通常呈现在元素周围的整体矩形区域，不随圆角（border-radius）变化而弯曲。
- 为了可访问性，不要完全移除 focus 状态的 outline，若需美化，建议用自定义样式替代。
基本上就这些，合理使用 outline 可以提升用户体验，尤其是在键盘导航场景中。