-
火车头导出HTML空白或乱码的根本原因是编码不一致或资源路径未处理；需勾选自动识别编码、统一保存路径为英文、配合wget或脚本下载并替换资源路径。
-
CSS不支持border-color使用linear-gradient，需用background+background-clip:padding-box或伪元素模拟；关键点是padding与border-width相等、border设为transparent。
-
HTML5图标显示异常可因路径错误、引用不当或字体未加载，解决方法包括：一、用iconfont类名引用；二、用Unicode字符引用；三、用img标签引用位图；四、内联SVG图标；五、预加载字体文件。
-
label能关联所有可聚焦、可交互的原生表单控件，但仅对具备原生交互能力的控件（如文本类input、checkbox、radio、textarea、select、button、range、color）点击label才能触发聚焦或切换；显式for绑定需确保id唯一匹配，隐式包裹更可靠；aria-labelledby仅用于无障碍描述，不替代for功能。
-
iOSSafari禁止自动播放音频，必须通过用户手势同步调用play()解锁；需先用muted属性静音初始化audio，再解除静音；WebAudioAPI也需在手势中初始化并resumeAudioContext。
-
clamp()三参数为min、preferred、max，浏览器线性插值计算字体大小：min设最小可读尺寸（如1rem），preferred用相对单位（如2.5vw），max设上限（如2.5rem），禁混用单位类型。
-
验证码，简单来说，就是为了区分你是人还是机器。在HTML中，本身并没有直接生成验证码的功能，需要借助后端语言（如PHP、Python等）和前端技术（如JavaScript）配合实现。解决方案后端生成验证码图片和随机字符串：后端脚本负责生成一个随机字符串（例如，包含数字和字母）。将该字符串绘制成一张图片。这通常涉及图像处理库的使用。将该字符串存储在服务器端的Session中。注意，Session是与用户关联的，所以每个用户看到的验证码都不同。将验证码图片以适当的格式（如PNG、JPEG）返回给前端。前端展示
-
flex:1在li上无效是因为ul未设display:flex；必须先让ul成为Flex容器，再对li使用flex:1（即flex-basis:0）才能实现等宽分配。
-
默认box-sizing为content-box时，width仅指内容区宽度，padding和border会额外增加尺寸；全局启用border-box需用、::before、*::after及html双重声明，但canvas等组件和第三方库可能需例外处理。
-
IE8及更早版本不支持rgba()，需用filter:alpha(opacity=50)兜底；filter只作用于块级元素且影响整个元素透明度，而rgba仅作用于颜色通道，二者机制不同，不可互换。
-
localStorage存取数据最安全做法是：存对象用JSON.stringify()、取值先判空再JSON.parse()；键名用字母数字组合；超限时捕获QuotaExceededError并降级；避免clear()误删，批量删除需遍历判断前缀。
-
max-width比width更适合响应式容器，因其允许窄屏收缩、宽屏限幅，配合margin:0auto实现居中；min-width防止中等屏幕下内容过挤，需与max-width合理组合并依设计断点设定。
-
Flex子项默认min-width:auto导致overflow失效，因其强制子项不小于内容宽度；解决方法是显式设置min-width:0，配合flex收缩属性、overflow:hidden及text-overflow:ellipsis等生效。
-
animation-play-state仅控制CSS动画，对JS动画无效；需确认元素有animation属性，可用style.animationPlayState或class切换状态，暂停不重置计时器。
-
border-style、border-width和border-color可单独或组合设置边框；2.推荐使用简写属性border:widthstylecolor，其中style必不可少；3.可分别设置四条边的样式，每边可不同；4.省略style则无边框，省略width使用默认值，省略color则取文本颜色。
