-
font-kerning控制字偶距启用与否，仅影响特定字符对间距，与文本截断无关；实现单行截断需overflow:hidden、white-space:nowrap、text-overflow:ellipsis三者配合。
-
:lang()伪类需HTML元素含符合BCP47的lang属性（如zh-CN）才生效；:lang(zh)匹配所有zh开头值，:lang(zh-CN)仅精确匹配；须在html根节点设默认lang并局部覆盖，配合预加载字体、避免全局混排、处理Safari兼容性及布局抖动。
-
当页面中某些标题区域存在HTML元素而另一些缺失时，需插入视觉隐藏但保留原始尺寸的占位元素，避免布局偏移；opacity:0是兼顾渲染占位与构建兼容性的最优解。
-
本文介绍如何在确保Shopify账户注册表单校验通过的前提下，实现自动跳转至目标页面（如/account/addresses），避免因强制重定向导致前端验证失效或用户跳过必填项。核心方案是利用Liquid的form.posted_successfully?状态判断，配合客户端JavaScript完成二次跳转。
-
querySelector方法用于查找文档中第一个匹配指定CSS选择器的元素。其核心特点是“选择器”和“第一个”，若需操作所有匹配项则应使用querySelectorAll；对于不存在的元素，它返回null，因此必须进行空值检查以避免错误；此外，虽然支持复杂选择器，但建议保持简洁以提升可维护性与性能。
-
fixed元素滚动抖动的根本原因是祖先元素设置transform等属性导致创建局部坐标系，使其脱离视口而相对该祖先定位；解决方案是将其移至body下或改用sticky+占位。
-
opacity+transform动画更流畅，因transform触发GPU合成层加速，避免重绘；需配合不改变视觉的transform（如translateZ(0)）并避免触发布局的属性。
-
Puppeteer截图+FFmpeg合成MP4是最可行方案：启动Chromium实例准确渲染各类内容，逐帧截图后用FFmpeg严格按帧率、尺寸、无音频参数合成视频，需注意环境字体、权限及动态内容就绪检测。
-
HTML里怎么写、&这些符号直接写、&，别用键盘上按出来的原字符。浏览器一见到裸的
-
float会导致父容器高度塌陷，因其使元素脱离文档流；修复需清除浮动，如伪元素clearfix；它不支持等高列且响应式中易失控，现代布局应优先使用Flexbox或Grid。
-
Web页面背景图首选WebP，次选AVIF；WebP兼具高压缩率、快解码与广浏览器支持，体积比JPEG小25%–35%，支持透明通道且CSS行为一致。
-
<marquee>不支持border-radius因其非标准、盒模型未定义且被主流浏览器废弃；需用div+@keyframes实现：外层设overflow:hidden和border-box，内层用transform:translateX()动画。
-
用CSS骨架屏加载效果的核心是渐变背景+位移动画：1.用语义化空元素占位并设浅灰底色和圆角；2.线性渐变创建亮色条带，配合background-size和background-position实现扫描光效；3.通过@keyframes让背景位置水平移动，时长1.5~2s，infinite循环；4.优化细节如头像溢出隐藏、文字间距、按钮尺寸及动画错峰。
-
在HTML中插入图片的核心是使用<img>标签，其必备属性为src和alt，其中src用于指定图片路径，alt提供替代文本以提升可访问性和SEO；此外，width和height属性有助于避免布局抖动，而优化图片加载则需压缩图片、选择合适格式（如JPEG、PNG、WebP、SVG）、使用响应式图片（通过srcset和sizes属性）、启用懒加载（loading="lazy"）以及利用CDN加速；常见图片不显示的问题多源于路径错误、文件缺失或服务器权限问题，可通过开发者工具检查Network请求状
-
本文详解如何解决多分类商品页中“切换类别后仍添加首类商品”的典型Bug，核心在于修正querySelector的误用、重构商品索引逻辑，并确保每个按钮精准关联对应商品。
