-
轮播图组件通过HTML结构、CSS样式和JavaScript逻辑实现自动播放、手动切换与指示器功能，支持悬停暂停和多实例复用，适用于网页图片展示。
-
混用font-size的%和px会破坏继承链，导致字体大小计算失控；应锚定根字号，组件内用em/%缩放，line-height必须用无单位值。
-
长文本溢出容器不换行的根源是white-space被设为nowrap或pre；中文长串需用overflow-wrap:break-word或word-break:break-all；Flex/Grid子项须加min-width:0才能正常折行。
-
本文介绍如何使用原生JavaScript的事件委托机制，精准移除触发事件的按钮所在最近的指定父容器（如.item），避免ID冲突与重复绑定问题，并支持动态添加的元素。
-
本文详解如何使用Yup的ref()和notOneOf()实现密码字段对用户名的动态校验，避免密码中包含用户名，并结合正则确保密码符合复杂度要求。
-
本文详解如何在Angular中正确使用[innerHTML]渲染含HTML标签的字符串（如段落、换行、超链接），同时避免被Angular默认的DOM安全策略拦截，并说明为何直接绑定字符串无效、如何通过DomSanitizer安全绕过、以及如何兼顾可读性与安全性。
-
浮动元素不换行的根本原因是“没地方换”，即当前行剩余空间不足或父容器布局模型（如flex/grid）使float失效，而非CSS书写错误。
-
class和id的核心差异是唯一性与复用性：1.id具有唯一性，一个页面中只能出现一次，用于唯一标识元素，适合锚点跳转、JavaScript精确操作和表单关联；2.class具有复用性，可被多个元素共享，一个元素也可拥有多个class，适合样式复用、语义化分组和JavaScript批量操作；3.从CSS特异性看，id选择器权重为100，class为10，id优先级更高；4.现代开发中应优先使用class，因其更利于组件化、模块化和维护，仅在需要唯一标识时使用id。
-
HTML5不支持RTSP协议和原生录屏；可行方案仅有服务端转存（如FFmpeg拉流录MP4/HLS）或客户端MediaRecorder录制WebRTC流；hls.js等无法直接录制，且需注意权限、跨域、内存溢出等问题。
-
Zustand的persist中间件在页面刷新后会丢失store中定义的方法（如setColor），因其仅持久化可序列化的状态值，而函数无法被JSON序列化，导致重hydration后方法变为undefined。
-
答案：现代前端构建需选合适工具并持续优化。Webpack适合大型项目，Vite提升开发体验，Rollup优打包库，Parcel快速上手；通过代码分割、TreeShaking、压缩、缓存和依赖优化提升性能，结合分析工具与CI/CD实现持续优化。
-
:hover和:focus需显式组合（如:hover:focus）才能同时生效，否则样式互不影响；单独使用无法实现叠加态效果，且需注意优先级、可访问性及移动端兼容性。
-
使用CSSFlexbox可轻松创建响应式图片画廊，通过display:flex和flex-wrap实现自动换行与等比缩放，结合gap设置间距，flex属性控制最小宽度（如200px）并允许伸缩，配合媒体查询优化小屏显示（如600px以下设为150px），确保在不同设备上均具有良好视觉效果。
-
有序列表使用<ol>标签创建，浏览器自动分配从1开始的数字编号；通过start属性可自定义起始编号，如start="5"；CSS的list-style-type可设置编号样式，如lower-alpha（a,b,c）、upper-roman（I,II,III）等；reversed属性实现倒序显示，value属性指定某项具体编号，后续项自动递增。
-
JavaScript提升是引擎在编译阶段将var和function声明的声明部分提前至作用域顶部，但赋值仍保留在原位置；var声明提升后访问得undefined，function声明完全提升，function表达式仅变量声明提升，let/const存在暂时性死区。
