-
用flex布局配合align-items可解决标题和图文错位问题：先给共同父容器设display:flex，再用align-items:center等值控制垂直对齐，同时重置标题margin和line-height以确保一致性。
-
可以构建不依赖打包工具的现代化SPA。利用原生ES模块、动态导入和前端路由，通过<scripttype="module">加载模块，使用import()按需加载页面，结合history.pushState和popstate实现路由切换，动态渲染页面内容，并借助本地服务器运行，适合中小型项目或教学。
-
Proxy能全面监听对象操作，通过get、set、deleteProperty等陷阱捕获读取、赋值和删除行为，结合Reflect实现默认行为并确保this正确；利用递归与缓存机制可深度监听嵌套对象，动态属性与新增属性自动被拦截，无需额外处理，从而构建精确高效的响应式系统。
-
async/await是基于Promise的异步语法糖，使异步代码更线性易读；async函数自动返回Promise，await暂停执行并等待Promise完成，需在async函数内使用且错误须用try/catch捕获。
-
答案是利用HTML5拖放API实现拖拽排序，通过设置draggable属性和监听dragstart、dragover、drop事件控制元素移动，结合CSS提升交互反馈。
-
模板字符串使用反引号定义，支持多行文本和嵌入变量，通过${}插入变量或表达式，可提升代码可读性与编写效率。
-
HTML无法彻底加密，但可通过五种方式提升防护：一、禁用右键与文本选择；二、混淆HTML结构与内联内容；三、服务端动态渲染；四、添加不可见水印与DOM变动检测；五、启用SubresourceIntegrity与CSP策略。
-
:hover用于鼠标悬停时触发样式，如按钮变色、下拉菜单显示；:focus在元素获得焦点时生效，常用于输入框高亮和键盘导航，提升可访问性。两者可组合使用，统一交互反馈，但需注意移动端hover无效、focus不可省略，并遵循LVHFF顺序以确保样式正确应用。
-
重排比重绘更昂贵，因重排需重新计算几何属性并影响渲染树；重绘仅更新像素颜色等不改变布局的样式；强制同步布局和频繁DOM操作是主要性能瓶颈。
-
在TailwindCSS中，预设的w-108并不存在，导致图片无法按预期缩放；需使用任意值语法w-[108px]显式声明宽度，才能生效。
-
flex属性三值依次为flex-grow、flex-shrink、flex-basis，不可调换；按比例分配宽度只需设flex-grow，且flex-basis应为0（非auto）以避免内容宽干扰；margin/border会侵占剩余空间，推荐用gap和box-sizing:border-box保障比例准确。
-
JavaScript原型链是属性查找的底层机制：prototype是函数对象属性，指向实例原型；__proto__是对象内部链接，指向其原型。查找时从自身开始逐级向上，直至null。
-
HTML文件不能保存图片，只能用<img>标签引用图片；路径必须匹配物理位置：同目录写“photo.jpg”，子目录写“images/photo.jpg”，禁用本地绝对路径；Python生成时需确保src路径与HTML文件相对位置正确。
-
outline不占布局空间且位于border外，用于非干扰性提示；border属盒模型部分，影响尺寸与结构，适用于常规边框设计。
-
JavaScript中if/elseif/else和switch用于条件判断，for/while/do...while实现循环；if条件自动转布尔值，switch严格相等且需break防穿透，for适合已知次数，while先判后执，do...while至少执行一次。
