-
在Leaflet中实现一个始终固定于地图视口中心的标记，关键在于正确监听地图移动事件并动态更新标记位置；需注意事件回调参数是LeafletEvent对象，地图实例需通过event.target访问。
-
必须用bdi隔离用户生成内容方向，否则RTL/LTR混排时标点错位、数字倒序、复制失真几乎必然；bdi强制创建BIDI隔离段，无视父容器dir，仅依内部首字符独立运行UBA，而bdo是字符级硬翻转，仅适用于调试或镜像场景。
-
relative定位不改变元素在文档流中的位置，但会为absolute子元素创建新的定位上下文；即使无偏移，设为relative的父元素也会成为子元素定位参照物；子元素的top、left等属性将相对于该父元素计算，而非继续向上查找；若无定位祖先，则默认相对于视口定位；relative元素仍占据原空间，布局不受影响；常用于弹窗、下拉菜单、卡片按钮、轮播图箭头等需要局部精确定位的场景；其核心作用是静默建立坐标系，实现子元素自由定位且不破坏整体布局。
-
JavaScript操作HTML元素的核心是先用querySelector等方法获取元素，再通过textContent、style、classList等属性或addEventListener等方法修改内容、样式、属性及绑定事件。
-
flat(Infinity)对嵌套评论“不起作用”是因为它只扁平化数组的数组，无法自动提取对象中的replies等字段；仅当数据已是多层嵌套数组形式时才有效，标准树形结构应使用递归flatMap。
-
浏览器静默跳过<source>的最常见原因是media属性写法错误，必须是完整合法的CSS媒体查询，括号不能省、关键字不能漏；其次type值错误、服务器Content-Type不匹配、<source>顺序不当或图片文件损坏也会导致fallback。
-
cite属性仅合法用于<blockquote>、<q>、<ins>、四个标签，值必须为URL，与<cite>元素语义不同，不可混用。
-
<p>滚动百分比应使用document.documentElement.scrollHeight-window.innerHeight计算最大可滚动距离，再结合window.scrollY与Math.min/max限定范围，并用requestAnimationFrame节流更新，同时适配暗色模式与移动端弹性滚动。</p>
-
色差主因是浏览器对HEX颜色的色彩空间解释不一致；必须用rgb(255107107)等显式sRGB语法锚定空间，否则linear-gradient中同一HEX值在Chrome、Firefox、Safari里映射的物理色不同，导致插值路径和最终渐变效果差异。
-
键盘焦点测试必须纯键盘操作并配合开发者工具验证，需检查焦点顺序是否符合DOM结构、可聚焦元素是否缺失tabindex或被禁用、滚动容器是否可聚焦、模态框焦点捕获与回退是否正确，以及视觉反馈是否完备。
-
@media(color-gamut:p3)仅检测设备P3能力，不触发颜色升级；要显示更鲜艳色必须用color(display-p3)函数配合@supports检测，并提供sRGBfallback。
-
JavaScript运算符共分算术、赋值、比较、逻辑、位、一元、三元及其他特殊运算符八大类；其中比较运算符（如===、==、>等）判断关系并返回布尔值，逻辑运算符（&&、||、!）组合条件并支持短路与隐式转换，二者常配合用于条件控制。
-
用语义化HTML（section/ol/li）与CSSGrid构建响应式运动计划页，信息层级清晰、适配手机与打印，支持无障碍访问和锚点跳转，无需JS即可实现高效维护与长期可用。
-
关键在于将异步链路重构为职责内聚的对象，通过具名方法封装状态流转、错误处理与副作用，统一管理生命周期、支持链式调用和消息契约，提升可读性、可测性与可维护性。
-
用::before伪元素为标题添加装饰线需先设标题position:relative，再用content:"";、width/height、background-color及top:50%;transform:translateY(-50%);实现垂直居中，left负值控制位置，配合padding-left留白，支持多级标题、响应式与CSS变量主题切换。
