-
flex:1在含文字列表中无法等宽，因flex-basis:0+flex-shrink:1导致长文本撑开后压缩失衡；可靠方案是flex:00calc(100%/n)配合min-width:0和white-space控制换行或截断。
-
应使用inputtype="number"实现百分比输入框，仅存储纯数字（如85），通过CSS伪元素添加“%”视觉后缀，并配合min/max、step、aria-label等确保语义化、可访问性与数据准确性。
-
fetch()是推荐的原生方案但不因HTTP错误状态reject，需手动检查response.ok；默认不带cookie，无超时控制，不支持progress事件；XMLHttpRequest仍适用需细粒度控制场景；jQuery.ajax()已不推荐。
-
本文详解如何在Shopify主题中实现cart.item_count的无刷新动态更新，避免页面重载即可实时反映购物车变化，涵盖Liquid模板改造、AJAX请求优化及事件钩子最佳实践。本文详解如何在Shopify主题中实现`cart.item_count`的无刷新动态更新，避免页面重载即可实时反映购物车变化，涵盖Liquid模板改造、AJAX请求优化及事件钩子最佳实践。在Shopify主题开发中，仅依赖Liquid的{
-
scoped不能真正隔离样式，因为它不创建DOM边界或改变CSS作用域模型，仅通过编译时重写选择器（如.button→.button[data-v-xxx]）并添加属性标识实现类名级隔离；全局规则（*、button）、!important、高权重选择器、v-html插入内容及SSR哈希不一致均使其失效。
-
backdrop-filter没效果的主因是元素不透明且背后无内容：必须设半透明背景（如rgba）并确保父层有可见内容，否则无法取样模糊。
-
使用CSS和JavaScript可实现HTML动画，CSS通过@keyframes和animation属性实现高效简单动画，如元素移动；JavaScript通过控制样式或结合requestAnimationFrame实现复杂交互动画，但性能较低；两者结合可利用CSS动画的高性能与JavaScript的灵活性，如用JavaScript控制CSS动画的播放状态；动画优化需注重使用transform和opacity、避免布局重排、减少DOM操作，并优先使用CSS动画；调试可通过浏览器开发者工具分析帧率与性能；对
-
加-webkit-overflow-scrolling:touch可解决iOS滚动卡顿，前提是容器有明确高度约束且overflow-y为scroll或auto；否则无效，并可能引发z-index错乱、fixed定位异常、回弹冻结等问题，需配合overscroll-behavior或事件拦截等措施。
-
parseQuery和stringifyQuery是VueRouter中成对使用的自定义函数：前者将URL查询字符串（如id=123&name=张三）解析为JS对象，后者将JS对象序列化为查询字符串（不含?），二者必须配套使用以确保加密参数的正确加解密与路由参数完整性。
-
column-count仅能实现视觉近似瀑布流，非真正Masonry布局；因按文档流“切片分栏”，DOM与视觉顺序错位，仅适用于纯展示、无交互、卡片高度相近场景。
-
CSS中设置背景颜色的方法包括：一、使用颜色关键字如red；二、十六进制值如#ff5733；三、RGB函数如rgb(255,87,51)；四、RGBA函数如rgba(255,87,51,0.6)；五、HSL函数如hsl(120,100%,50%)；六、HSLA函数如hsla(120,100%,50%,0.4)，分别适用于不同设计需求。
-
行，但需兼顾浏览器兼容性、字体支持与样式细节：iOSSafari12.2+、AndroidChrome76+支持writing-mode:vertical-rl，微信X5内核及旧iOSWebKit支持不佳，须配合text-orientation:mixed、font-familyfallback及真机测试。
-
inline-block列表项换行主因是HTML空格被渲染为间隙，导致宽度计算偏差；解决法包括父元素font-size:0+子元素重设字号、删空格或改用flex布局。
-
Map的set和get方法支持任意类型键，区别于Object的字符串强制转换；set可存对象、NaN等，get严格匹配且不类型转换，适用于缓存、DOM关联、Symbol键等场景。
-
<p>Safari15.4及更早版本不支持calc()嵌套，会静默丢弃整条声明；应改用CSS变量分步计算，如--inner-width:calc(100%-40px);width:calc(var(--inner-width)/3)。</p>
