伪类_第3页_南昌壹佳企网络通信有限公司

应警惕布局嵌套超三层，优先拆分为独立组件并采用BEM扁平命名；Flexbox仅用于局部对齐，主结构用文档流；响应式规则内联组件内，状态样式与布局样式分离。

@keyframes是定义动画关键帧规则的CSS规则，本身不触发动画；animation属性引用它并控制播放行为。必须命名合法、区分大小写，至少含from和to两帧，仅支持可动画属性，需配合animation才生效。

:first-child和:last-child不能直接连写以匹配唯一子元素，仅当该元素是父容器的唯一子元素时才生效；选某类型首个/末个实例须用:first-of-type/:last-of-type。

应优先用box-shadow替代outline实现聚焦高亮，配合focus-visible区分交互方式，并确保viewport正确以解决iOSSafari兼容问题。

本文详解如何使用CSS选择器精准为表单中除首个.form-group外的所有.label元素添加margin-top，纠正:not(:nth-child(1))的误用，并提供语义正确、浏览器兼容的解决方案。

根本原因是未设置box-sizing时浏览器默认content-box导致边框增加额外撑开容器；必须用box-sizing:border-box使宽高包含边框，避免布局跳动。

需为::placeholder声明所有主流浏览器前缀并按标准写法置后，配合opacity控制可见性，同时重置表单控件基础样式以确保一致性。

transition必须写在子元素常态规则中，且父元素hover时子元素属性值必须发生可过渡的真实变化。常见错误包括：属性不可过渡（如display）、变化量为0、选择器未命中或优先级被覆盖。

transition必须写在将要发生变化的元素本身上，而非父元素或触发元素；仅可计算且有中间值的属性（如opacity、transform）支持过渡；需显式声明初始值，避免使用auto等不可插值关键字。