-
addEventListener的第三个参数决定事件监听阶段：true为捕获阶段，false（默认）为冒泡阶段；它影响执行顺序、stopPropagation()效果及target与currentTarget的区别。
-
prefers-color-scheme是CSS媒体特性，用于声明式适配系统深色模式，支持Chrome76+、Firefox67+、Safari12.1+，值为light/dark/no-preference；应结合CSS自定义属性与合理色彩体系实现语义化主题切换，而非简单反色或硬编码颜色。
-
v-html不自动转义，直接插入HTML存在XSS风险；它绕过Vue编译，不解析插值、指令，也不响应数据变化；安全使用须前置清洗（如DOMPurify），禁用裸传用户输入。
-
font-weight属性通过100-900九级数值实现文字粗细分级，400为常规文本，700为加粗，支持normal、bold关键字及lighter、bolder相对值；并非所有字体均支持全部字重，需确保字体文件包含所需字重以避免浏览器fallback偏差；设计中可利用不同字重构建信息层级：h1-h6标题用600或700形成梯度，正文设400保证可读性，辅助信息用200-300营造轻盈感，关键词高亮可用500-600适度强调；为保障跨设备一致性，应选用如Inter、Roboto等多字重字体，通过@imp
-
利用:hover触发状态变化，结合::before/::after创建视觉层，通过transition和transform实现平滑动画，如背景色渐变、滑入遮罩、上浮下划线等效果，关键在于伪元素content设置与定位上下文控制。
-
preload是浏览器提前获取关键资源的声明式方式，不阻塞渲染但提升字体、图片等核心资源加载优先级；需正确设置crossorigin以避免字体重复请求，仅预加载首屏必需的字体变体并搭配font-display:swap，图片preload仅适用于CSS背景图、JS动态插入等特殊高优先级场景。
-
高度塌陷由子元素脱离文档流导致，解决方法包括：1.使用clearfix类通过伪元素清除浮动；2.触发父元素BFC，如设置display:flow-root或overflow:hidden；3.采用flex或grid布局，自动包裹子元素；4.避免使用固定高度。推荐优先使用display:flow-root或现代布局方式。
-
优先选position:sticky；它支持滚动吸附且不脱离文档流，适用于导航栏等场景；absolute仅用于精确偏移（如气泡），fixed仅用于视口级固定（如全局toast）。
-
直接修改element.style仅影响内联样式且需驼峰命名；读取真实样式用getComputedStyle()；批量改样式推荐切换className或classList；CSS变量通过setProperty设置，优先使用语义化类名和属性控制而非硬编码style。
-
使用a:visited伪类可改变已访问链接颜色，需按LVHA顺序定义link、visited、hover、active状态，且受限于隐私保护，仅允许修改color等少数属性。
-
用background-position滑动渐变实现颜色过渡动画最稳定，需设background-size为200%且避免简写；多层opacity切换适合硬切多阶段渐变；GPU加速和属性拆分是流畅关键。
-
CSS选择器的功能包括基本选择、属性选择、位置选择和状态选择。1.类型选择器如div、p直接选择元素。2.类和ID选择器通过.和#加名称精确定位。3.属性选择器如input[type="text"]根据属性值选择。4.后代和子选择器如divp和div>p选择特定位置的元素。5.伪类和伪元素选择器如:hover和::before根据交互状态或插入内容选择。通过这些选择器，我们可以灵活控制网页元素的样式。
-
本文详解在原生JavaScript和jQuery中正确获取<select>下拉框当前选中值的方法，指出常见错误（如误用:selected在非<option>上），并提供可靠、可复用的代码示例。
-
float布局已过时，易致父容器塌陷和错位，仅限IE8及以下兼容；现代推荐flex（两行代码实现两栏）或grid（适合复杂嵌套）。
-
实时通信可通过WebSocket、Socket.IO、SSE和长轮询实现；WebSocket提供全双工通信，Socket.IO增强兼容与功能，SSE支持服务端单向推送，长轮询用于低兼容环境，按需选择可构建高效交互应用。
