-
:required伪类需配合HTML中真实存在的required属性才能生效，仅对<input>、<select>、<textarea>等原生表单控件有效；required="false"无效，动态添加需确保DOM更新，旧版Safari存在兼容性问题。
-
:empty只匹配完全无子节点（含文本、注释、元素）的元素，换行、空格、注释均使其失效；:blank才忽略空白符但兼容性差；稳妥替代法是服务端不渲染或JS判断innerText.trim()后控制显示。
-
float在现代开发中已无布局未来，仅剩邮件模板多栏排版和图文环绕两个不可替代场景；display:flow-root是标准清除方案，而迁移本质是思维重构——从“让元素浮起”转向“定义数据流与轴向”。
-
根本原因是未统一声明transition导致属性重绘不一致；应为真正触发样式的元素（如li或a）显式设置相同duration、timing-function的transition，仅包含color、background-color、transform、box-shadow等可GPU加速属性。
-
word-break和overflow-wrap触发条件不同：前者暴力拆词，后者礼貌换行；中文场景推荐overflow-wrap:break-word+word-break:keep-all。
-
通过CSS动画与渐变背景结合，可创建流动渐变、光扫效果和多层动效；利用background-position、background-size配合@keyframes实现无需JavaScript的流畅动画，常用于背景、按钮悬停或卡片设计，需注意渐变尺寸和动画缓动以确保视觉平滑。
-
使用HTML属性和JavaScript可有效限制表单输入。首先通过maxlength、min/max、pattern、required和type等属性设置基础规则，如限制长度、数值范围和格式；再结合CSS的:valid/:invalid伪类实现视觉反馈；对于更复杂需求，利用JavaScript监听输入事件，实时过滤非法字符或自动格式化内容。最终建议前端限制与服务器端验证结合，确保数据安全与准确性。
-
首先检查图片路径和CSS应用是否正确，再通过内联样式、外部CSS或class选择器设置background-image，并确保background-size等属性适配，最后利用开发者工具排查404或覆盖问题。
-
应使用requestAnimationFrame替代setInterval实现动画主循环，因其与屏幕刷新率同步、精度高且不易卡顿；需在回调中更新状态并重绘，末尾递归调用自身，避免耗时操作，配合keydown/keyup监听按键状态，注意Canvas坐标系、图像加载时机、变换隔离及AABB碰撞检测等关键细节。
-
PerformanceMarker可用于标记代码时间点以测量交互延迟，通过performance.mark和measure记录开始结束时间并计算耗时，帮助定位性能瓶颈；结合React或Vue生命周期可监控组件渲染性能，同时支持自定义指标如首屏时间；配合ChromeDevTools、Lighthouse、WebPageTest及APM工具可全面优化用户体验。
-
合理使用语义化HTML标签并优化元数据可提升网页排名，如用h1标签突出核心关键词，h2至h6构建内容层级，结合article、section等增强可读性，同时优化title和description元标签以提高点击率与收录效果。
-
要学，但仅限于文字环绕图片、旧项目维护、邮件模板等特定场景；现代布局应优先使用flex或grid，因其更健壮、易维护且无文档流问题。
-
答案：通过HTML的disabled属性、CSS视觉样式和JavaScript动态控制，可有效管理按钮禁用状态。结合框架状态绑定，实现交互反馈与用户体验优化。
-
能用，但需上层逻辑实现协同功能；mark仅提供语义化静态高亮，不支持实时同步、权限控制或版本管理，实际项目多用数据层记录范围并动态渲染。
-
Worker是浏览器提供的多线程机制，用于在后台线程执行耗时任务以避免阻塞主线程；需独立JS文件，通过postMessage/onmessage通信，数据经序列化复制传递。
