-
优先选watch解决需比对新旧值的场景,如权限跳转、状态通知、表单校验;watchEffect适用于依赖动态、只需响应“有变化”的场景,如搜索建议。
-
scrollbar-color仅在Firefox(64+)中生效,Chrome、Edge、Safari等WebKit/Blink内核浏览器完全不支持,必须使用::-webkit-scrollbar伪元素系列实现等效效果。
-
默认CSS盒模型使width不包含padding和border,导致实际宽度超出;使用box-sizing:border-box可让width包含二者,推荐全局设置*{box-sizing:border-box},并配合calc()、flex:1等避免溢出。
-
先设置border-collapse:collapse避免双线边框,再统一定义table,th,td的border样式;通过调整边框宽度、颜色和类型(如solid、dashed)美化表格,可单独设置th下边框或外边框突出表头。
-
用纯HTML+CSS实现链接卡片,必须以语义化<a>为外层容器并设有效href;内部用<h3>标题、<p>描述、<spanclass="domain">域名及带onerror兜底的<img>加载favicon;CSS统一border-radius:8px,用box-shadow和font-weight实现hover反馈,并强制a:focus-visible{outline}保障可访问性。
-
优点: 简单快捷">
CDN引入适用于简单项目,通过link标签引入CSS,如ElementPlus;2.npm安装后全局引入,便于版本管理;3.按需引入推荐用于大型项目,结合插件自动导入组件及样式;4.使用SCSS变量定制主题,先定义变量再引入组件库样式,实现个性化主题。选择方式应根据项目规模与性能需求决定。
-
采用BEM命名法规范类名,按模块拆分CSS文件,使用scoped隔离样式,避免深层嵌套与全局污染,提升可维护性与性能。