能，但引入的CSS总是全局生效；真局部需作用域隔离，如加父级前缀、scoped、CSS Modules或Shadow DOM。
局部 CSS 文件能直接用
能，但效果不是“局部”—— CSS 本身没原生“局部作用域”概念，必须靠人工约束或工具辅助。常见做法有三类： 如果非要用独立 CSS 文件（比如第三方 UI 片段），又不想影响其他地方，关键在「选择器收敛」和「命名克制」： 只有 立即学习“前端免费学习笔记（深入）”； 这时 多数所谓“局部样式”其实是命名+结构约定出来的假局部，真隔离成本高。选哪种，取决于你控不控制 HTML 结构、用不用构建工具、以及要不要支持老浏览器。 总是全局生效。浏览器加载后，里面所有选择器都会参与整个页面的样式匹配，不管它写在哪个 真想只影响某块区域，得靠作用域隔离
.article-content h2 { font-size: 1.5em; }所有规则都以
.article-content p { line-height: 1.6; }.article-content 开头，确保只作用于该容器内scoped（Vue 单文件组件专属）：Vue 编译时自动为选择器和元素添加唯一属性，实现模拟局部作用域button.module.css 中的 .primary 编译成类似 Button_primary__xyz123 的唯一类名，再通过 JS 显式导入使用
引入的 CSS 怎么避免污染全局？
#user-profile-card .card-title，而不是直接写 .card-title
body、h1 等全局标签选择器!important 覆盖别人，而是靠层级和 specificity 控制优先级 放在主样式表之后，才能确保它的规则有机会被更具体的父选择器压制Shadow DOM 是唯一真正局部的方式
Shadow DOM 能做到样式完全隔离——外部 CSS 进不去，内部 CSS 出不来。但需要主动创建：const host = document.querySelector('#my-widget');
const shadow = host.attachShadow({ mode: 'closed' });
shadow.innerHTML = `Hello
`;h3 样式不会泄露到主文档，主文档的 h3 样式也不会影响它。代价是 DOM 隔离、事件穿透需额外处理，不适合简单嵌入。
