答案：outline属性用于在元素边框外绘制轮廓线，突出显示元素且不影响布局。它由颜色、样式和宽度组成，顺序任意，常用样式包括solid、dashed等，必须设置style才可见。可配合outline-offset调整位置，常用于焦点提示，建议保留表单元素的focus轮廓以提升可访问性。
在 CSS 中，outline 属性用于在元素的边框外绘制一条轮廓线，用来突出显示元素。与边框（border）不同的是，outline 不占据文档流空间，不会影响元素的尺寸或位置。
outline 基本语法
outline 是一个简写属性，可以同时设置颜色、样式和宽度：
outline: [outline-color] [outline-style] [outline-width];三个值的顺序可以任意，浏览器会自动识别。
常用 outline 属性值
你可以分别设置以下子属性，也可以使用简写：
立即学习“前端免费学习笔记（深入）”；
- outline-color：设置轮廓的颜色，比如 red、#000、transparent 等。
-
outline-style：必须设置，否则轮廓不会显示。常用值有：
- solid（实线）
- dashed（虚线）
- dotted（点线）
- double（双线）
- none（无轮廓，默认）
- outline-width：设置轮廓粗细，可选值有 thin、medium、thick 或具体像素值如 2px。
实际使用示例
下面是一些常见的用法：
/* 简写方式：红色实线轮廓，2px 宽 */.element {
outline: 2px solid red;
}
/ 蓝色虚线轮廓，3px 宽 /
.element {
outline: 3px dashed blue;
}
/ 透明轮廓（常用于去除默认 focus 样式后再自定义） /
button:focus {
outline: none; / 或 outline: transparent; /
}
注意事项
使用 outline 时要注意几点：
- outline 不是边框，它绘制在 border 外部，不影响布局。
- 即使元素没有 border，outline 依然可以显示。
- 大多数浏览器在表单元素（如 input、button）获得焦点时会自动添加 outline，出于可访问性考虑，不建议完全移除 focus outline，可替换为更美观的样式。
- 可以用 outline-offset 控制轮廓与边框之间的距离，正值向外，负值向内。
.element {
outline: 2px solid green;
outline-offset: 4px;
}
基本上就这些。合理使用 outline 可以提升用户体验，特别是在交互反馈方面。
