直接写 textarea:focus { outline: none; } 无效，需用 textarea.layui-textarea:focus { outline: none !important; box-shadow: none !important; border-color: #c0c0c0 !important; } 并添加 -webkit-tap-highlight-color: transparent; 兼容移动端，同时为键盘用户保留可访问性焦点样式。
textarea:focus 时蓝色高亮边框怎么关
直接写 textarea:focus { outline: none; } 就能去掉点击/聚焦后那圈难看的蓝色轮廓。但只写这一句常失效——因为 layui 的 textarea 往往被包在带 class 的容器里（比如 .layui-textarea），或者被框架样式用 !important 覆盖了。
必须加权重或补 !important，推荐这样写：
textarea.layui-textarea:focus {
outline: none !important;
}
如果用了自定义 class（比如你手动加了 class="my-textarea"），就换成 .my-textarea:focus；别漏掉伪类 :focus，写成 textarea { outline: none; } 是无效的。
为什么清了 outline 还有蓝边？可能是 box-shadow 或 border-color
某些主题（尤其是 Bootstrap 风格的定制皮肤）不用 outline 实现高亮，而是靠 box-shadow 或强化 border-color。这时候单清 outline 没用。
得一并处理：
box-shadow: none !important;-
border-color: #d2d2d2 !important;（设回你想要的边框色，别留空）
完整示例：
textarea.layui-textarea:focus {
outline: none !important;
box-shadow: none !important;
border-color: #c0c0c0 !important;
}
移动端点击后闪一下灰色蒙层？那是 -webkit-tap-highlight-color
这个和 outline 完全无关，是 iOS Safari 和部分安卓 WebView 在手指按下瞬间叠加的半透明遮罩。不加它，outline: none 再全也没用。
加这行就能关掉：
textarea.layui-textarea {
-webkit-tap-highlight-color: transparent;
}
注意：这个属性只在真实触摸设备上生效；桌面 Chrome 开发者工具切到「Touch」模拟模式才能预览效果。
去掉高亮后，键盘用户怎么办？别牺牲可访问性
清掉默认高亮后，纯键盘操作的用户（Tab 切换焦点）会失去视觉定位——他们看不到当前聚焦的是哪个 textarea。
建议手动补一个温和的焦点提示：
- 保留
outline: none，但加border: 2px solid #007bff或box-shadow: 0 0 0 2px rgba(0,123,255,0.25) - 确保颜色对比度够（WCAG AA 级要求至少 4.5:1）
- 别只针对鼠标用户优化，键盘焦点路径必须清晰可辨
真正麻烦的不是加几行 CSS，而是得同时兼顾鼠标、触屏、键盘三种交互路径——而且它们的触发时机和视觉反馈机制完全不同。
