-
input::placeholder不生效主因是浏览器兼容性（Safari15.4+才稳定支持::placeholder，旧版需加前缀）和CSS优先级冲突；深色主题下宜用color:#999+opacity:0.7；Tailwind需用dark:placeholder:text-gray-500，styled-components应避免模板字符串内写::placeholder。
-
clear:both失效的根本原因是浮动元素与clear元素不在同一BFC中；它仅使当前元素border-top避开同BFC内前序浮动元素的外边缘，若被不同BFC隔离或脱离文档流则完全失效。
-
直接用@keyframes+animation可实现可靠高性能滑入动画：定义slideIn关键帧使元素从translateX(-20px)/opacity:0到translateX(0)/opacity:1，再通过animation:slideIn0.4sease-outforwards应用，注意避免display:none、overflow:hidden等导致失效，并分离slide-in/slide-out逻辑确保多次进出稳定。
-
IDBValidKey包括字符串、数字（NaN和Infinity除外）、Date对象及元素均为IDBValidKey的数组，因其需满足唯一排序、稳定序列化和无歧义比较；null、undefined、对象、布尔值因破坏这些原则而被禁止。
-
css-vars-ponyfill是IE下支持CSS自定义属性的最可行方案，它在运行时解析并替换var()，支持嵌套、calc()内使用、动态更新及媒体查询作用域，但需注意IE对calc()+var()的兼容限制和动态更新时需显式触发重计算。
-
animation-iteration-count:infinite不生效的常见原因包括：未设置animation-duration、@keyframes缺少0%/100%或二者相同、animation-fill-mode未设为forwards/both、animation-play-state:paused或will-change导致异常，以及元素隐藏、JS重置动画或系统偏好reducesmotion。
-
@import在模块化项目中无法按需加载，因其是同步阻塞的原生CSS规则，不参与JS模块依赖图，Webpack/Vite默认不支持其条件加载或拆分，导致全量打包；推荐改用JS层动态importCSS、CSSModules配合提取插件或CSS-in-JS方案。
-
在SCSS中实现响应式悬浮效果应封装@media(hover:hover)and(pointer:fine)的mixin，而非依赖max-width断点；因悬停能力取决于输入设备（如鼠标/触屏），非屏幕尺寸，且需配合:active与cursor:pointer保障触摸反馈。
-
::first-letter中font-family不生效的根本原因是其仅继承父元素显式声明的字体，不拾取系统默认或UA样式表fallback；必须在父元素（如p）上明确设置font-family并确保WebFont加载完成。
-
直接用width在响应式表格中失效，是因为th和td宽度需同步计算，而浏览器默认独立处理；必须配合CSS变量+table-layout:fixed才能实现列宽一致。
-
能，但需拆分为多个独立动画并行触发而非叠加；若同时修改transform等属性，后声明的会覆盖前一个；推荐在单个@keyframes中用复合transform实现同步效果。
-
list-style属性用于设置列表标记样式，包含type、image、position三个子属性，可定义类型、图片和位置；使用list-style-image能替换为图片符号，但尺寸不可控；推荐通过list-style:none结合background-image实现完全自定义，便于控制图标大小与间距；常见type值有disc、circle、square、decimal等，none可去除标记，适用于导航菜单。
-
flex-wrap:wrap实现自动换行，需配合flex-basis或width控制子项基础宽度，并注意flex-shrink默认值导致的压缩不换行问题及gap兼容性陷阱。
-
伪类和伪元素不能像函数调用一样连写，但可合法组合为:hover::after表示悬停时渲染伪元素；必须设置content（非none或空值）且父元素需position:relative以支持position:absolute定位；移动端hover不可靠，应配合媒体查询或JS降级。
-
是。div与语义标签混用会破坏HTML语义，导致辅助技术无法正确解析结构；关键判断标准是去除CSS后结构是否仍可读、可导航、可索引。
