-
grid-template-areas用语义化名称定义网格区域，通过字符串“视觉草图”直观布局，配合grid-area快速分配元素，支持响应式一键切换结构，需注意行列数一致、用点号占位、名称严格匹配。
-
<summary>标签必须嵌套在<details>内才有效，作为其首个子元素定义可折叠标题，点击触发展开/收起；单独使用无效，且需注意Safari兼容性及手风琴等复杂交互应改用ARIA方案。
-
使用语义化标签如<header>、<nav>、<main>等替代<div>，合理嵌套、控制层级，配合BEM命名和统一代码格式，提升HTML可读性与维护性。
-
数据驱动的HTML文件是指内容通过外部数据动态生成而非硬编码在页面中。1.数据获取：从数据库、API或JSON文件等来源获取结构化数据；2.模板定义：创建含占位符的HTML模板，规定页面结构；3.数据绑定与渲染：通过前端JavaScript框架或后端模板引擎将数据填充至模板，生成完整HTML；4.内容呈现：将渲染后的HTML发送给浏览器展示。编辑HTML可采用文本编辑器手动编写，也可通过编程方式自动化修改。实现方式包括：客户端渲染（CSR），如React、Vue通过JS动态更新DOM；服务器端渲染（SSR
-
HTML5项目可通过Webpack、Gulp、直拷贝修正路径或Vite四种方式打包为静态文件：Webpack模块化打包并自动注入资源；Gulp流式处理压缩与哈希；直拷贝法适用于简易单页应用；Vite提供快速构建与ES2015兼容输出。
-
JavaScript中设置Cookie需通过document.cookie="key=value;expires=...;path=/;domain=..."字符串赋值，必须显式指定expires/max-age、path和domain才能正确覆盖或删除；读取需正则解析并decodeURIComponent；删除本质是写入过期同名Cookie，且path/domain必须严格匹配原值。
-
使用data-src存储真实图片地址，src指向极小占位图避免布局偏移；2.CSS设置图片自适应与淡入过渡效果；3.JavaScript通过IntersectionObserver监听视口进入，动态加载图片并添加loaded类；4.结合data-srcset与sizes实现响应式多尺寸加载，提升性能与用户体验。
-
text-shadow语法为水平偏移、垂直偏移、模糊半径、颜色，前三个必为长度单位，颜色可选；支持负值与多层逗号分隔；单层用于轻量提示，多层可实现立体或描边但需防性能问题；IE9+和Safari5.1+支持，旧版存在rgba和多层兼容性限制。
-
JavaScript中的“树结构”指DOM这种分层数据组织方式，以document为根节点，HTML元素按父子、兄弟关系嵌套构成树；常用遍历法包括childNodes/children、parentNode、next/previousElementSibling、querySelector及递归DFS与队列BFS。
-
HTML5无法卸载，需清理其运行时机制：清空localStorage/sessionStorage/indexedDB数据、注销ServiceWorker、删除PWA记录、禁用干扰扩展。
-
单例模式确保一个类仅有一个实例并提供全局访问点，如通过闭包实现唯一实例；工厂模式封装对象创建逻辑，根据条件返回不同类型对象，提升解耦性；观察者模式建立一对多依赖关系，状态变化时自动通知所有观察者，广泛用于事件系统；装饰器模式动态添加功能而不修改原结构，利用@decorator语法实现日志等横切关注点分离。这些模式借助JavaScript动态特性增强代码可维护性与扩展性，但需结合场景适度使用避免过度设计。
-
CSS动画结合clip-path可实现形状变换等视觉效果，通过@keyframes控制圆形展开等过渡，需确保函数类型与参数一致，适用于图片蒙版、文字遮罩等场景，注意保持坐标点数量一致以保证流畅性。
-
在Vue3中，直接赋值无法脱离响应式系统；若需对reactive对象做无副作用的修改（如删除字段而不影响原对象），应先用toRaw()获取原始对象，再通过展开运算符创建独立副本。
-
通过CSS自定义滚动条并利用:hover实现悬停效果，使用::-webkit-scrollbar等伪元素设置样式，并结合容器的hover状态改变滑块颜色或宽度，推荐应用于特定容器以提升用户体验。
-
Map是JavaScript中支持任意类型键、保持插入顺序、提供原生迭代和清晰集合操作接口的键值对集合；对象则适合结构化数据、原型继承和JSON序列化，但键仅限字符串/Symbol且无可靠顺序保证。
