-
JavaScript中的类与继承通过ES6的class和extends实现，本质基于原型链。1.class是构造函数的语法糖，方法挂载于prototype；2.extends建立子类与父类的原型连接，super调用父类构造；3.静态方法属类本身，私有字段以#开头限定访问；4.所有实例共享原型方法，继承通过__proto__向上查找。掌握语法与原型机制可提升代码可维护性。
-
使用Flexbox和Grid可实现响应式卡片等高排列。1.Flexbox通过display:flex与align-items:stretch使卡片自动拉伸，适合一维布局；2.Grid利用display:grid与repeat(auto-fit,minmax(250px,1fr))实现二维等高控制，多行更稳定；3.响应式推荐优先使用Grid，结合gap和minmax优化断点适配，保持视觉整齐。
-
JavaScript迭代协议通过Symbol.iterator让对象可迭代，实现该方法并返回带next()的迭代器对象，即可用for...of或展开运算符遍历；生成器函数（function*）配合yield能更简洁地创建迭代器，自动管理状态与next()逻辑，提升代码可读性与灵活性。
-
<p>在WSL2中配置Linux环境进行HTML+CSS开发，首先启用WSL2并安装Ubuntu等发行版，运行wsl--install后重启并设置用户；接着更新系统包sudoaptupdate&&sudoaptupgrade；推荐使用Python3内置服务器，在项目目录执行python3-mhttp.server8000，或通过Node.js安装http-server实现静态服务；文件编辑建议使用VSCode配合Remote-WSL扩展，避免直接通过Windows修改WSL文件
-
提升卡片视觉质感的关键在于层次感与细节：合理运用border-radius（如顶部12px、底部6px）和双层box-shadow（内层02px4pxrgba(0,0,0,0.06)，外层04px12pxrgba(0,0,0,0.08)），搭配浅色背景、统一内边距1.25rem、行高1.5及透明黑阴影。
-
position:absolute会脱离文档流导致父容器高度塌陷，需设position:relative并保留非绝对定位子元素；z-index失效因层叠上下文隔离，应统一管理父容器上下文；移动端right/top错位因box-sizing和单位选择不当；伪元素仅适用于纯装饰内容。
-
mask-image失效主因是三方面：需检查图片加载与CORS、元素必须有可绘制内容、Firefox要求SVGmask内fill明确；渐变蒙版须用luminance模式并避免rgba；clip-path优先于mask-image执行。
-
JavaScript是基于原型的语言，因其不依赖类而通过对象间委托关系实现复用与继承，该关系由prototype、__proto__及原型链终止于null共同构建。
-
overflow:hidden通过触发BFC使父容器正确包裹浮动或溢出内容，而非单纯隐藏；适用于浮动未清除、负margin、内容过长等场景，但会裁剪超出区域的内容。
-
Provide/Inject是Vue的祖先-后代通信机制，需传递响应式对象（如reactive、ref或computed）才能触发更新；直接解构会丢失响应性，推荐用toRefs或readonly保障响应链完整。
-
JavaScript通过window.history操作浏览器历史，支持后退、前进、跳转及修改URL而不刷新页面；仅限同源操作，无法读取完整历史；pushState添加新记录，replaceState替换当前记录；popstate监听导航变化并获取state数据。
-
根本原因是布局缺乏锚定主干，应使用max-width+margin:0auto固定容器宽度来切断样式传导链，再用flex/grid替代浮动/绝对定位，并集中管理响应式断点。
-
async与defer本质区别在于执行时机：async下载完立即执行且不保证顺序，可能阻塞DOM解析；defer则等DOM解析完按序执行。
-
dragover事件未阻止默认行为是拖拽失效的最常见原因，必须在每次dragover中调用event.preventDefault()；drop只触发于松手时鼠标正下方的元素，需确认目标元素尺寸、遮挡及事件绑定位置；文件读取仅限drop回调中的event.dataTransfer.files。
-
HTML中空白字符（空格、Tab、换行）默认被合并为单个空格；可用 实体或white-space:pre/pre-wrap实现可控空白；DOM中Tab仅影响可读性，不参与渲染。
