-
字体图标乱码主因是浏览器未加载到字体文件，需按路径→格式→名称→编码四步排查：检查CSS中@font-face路径是否正确（相对CSS文件）、格式是否齐全（woff2/woff/ttf/eot）、font-family名是否完全一致、Unicode编码是否匹配字体真实glyph。
-
“记住我”功能通过HttpOnlyCookie存储加密refresh_token并绑定设备指纹，配合短期access_token实现安全静默登录，禁止明文存密、自动填密码，且须支持远程注销与令牌轮换。
-
role属性是显式覆盖元素默认语义的开关，仅在无障碍树中生效；必须用于动态渲染、旧浏览器兜底、非标准容器及按钮化非按钮元素等场景，禁用与原生语义冲突的混用。
-
clear属性不能清除浮动本身，而是让当前元素避开前面浮动元素的干扰区域，强制下移至浮动元素下方以恢复布局流；它只对块级元素生效，且必须写在浮动元素之后的兄弟元素上。
-
z-index不生效主因是父元素创建了独立堆叠上下文，使子元素z-index仅在内部生效；需检查opacity<1、transform非none等触发属性，并提升父容器z-index或用Portal脱离上下文。
-
HTML5不支持直接设置边框实线，需用CSS的border属性实现；最简写法为border:2pxsolid#333；自适应靠rem、vw或容器响应式控制；移动端失效主因是缺失viewport、Retina屏1px发虚或overflow截断。
-
::selection不支持border是因为CSS规范未允许该属性作用于选中文本，仅color、background-color、text-shadow和cursor有效；替代方案是JS监听selectionchange并动态包裹选中内容。
-
通过CSS背景定位与内容区域遮罩结合，可实现在容器左右边缘各显示20%宽度的背景图，中间60%区域展示纯色内容层，从而营造“背景仅出现在两侧”的视觉效果。
-
DOMJavaScript动态修改网页的核心是先获取元素再修改其内容、样式、结构或行为；常用方法包括getElementById、querySelector、querySelectorAll、parentElement/children；修改用textContent、innerHTML、classList等。
-
srcset属性在linkrel="icon"标签中不被任何主流浏览器支持；浏览器会忽略srcset和sizes，仅加载href指定的图标，必须用多个link标签分别声明不同尺寸和type的图标。
-
align-items:stretch未使卡片高度一致，是因为父容器缺少显式高度、子项存在height/min-height/flex-shrink:0等限制，或内容撑开导致拉伸失效；需同时满足容器有高度、子项可伸缩、无收缩禁用才生效。
-
auto-fit只创建有内容的轨道并拉伸填满容器，auto-fill则无论内容多少都按minmax()尽可能预留全部轨道，导致空列和布局错位。
-
使用flex-wrap和gap可实现Flexbox布局中的自动换行与间距控制。1.设置flex-wrap:wrap允许子元素在空间不足时换行，避免溢出；2.使用gap统一设置子元素间的水平和垂直间距，简化样式管理；3.建议结合flex:11200px等弹性设置与媒体查询优化响应式效果，避免混用margin防止间距混乱，提升布局效率与可维护性。
-
JavaScript代码压缩几乎不影响运行时性能，主要提升加载阶段速度——减小体积、加速网络传输与初始解析；执行性能取决于AST结构和引擎优化，与变量名长度、空格注释等无关。
-
FileReader可读取任意File对象，能否正确解析取决于所选方法：readAsText适用于文本文件，readAsDataURL适合资源预览，readAsArrayBuffer用于二进制处理，readAsBinaryString已废弃；浏览器限制其仅能读取用户主动选择的文件，且操作均为异步。
