-
列数由grid-template-columns轨道数决定，如1fr2frauto为3列；repeat()防手误；minmax()算1条轨道；grid-template-rows定义显式行但空行高度为0；auto-fit删空轨，auto-fill留空轨；grid-template-areas行列数须与rows/columns声明严格匹配。
-
最直接实现进度指示的方式是使用HTML的<progress>元素，结合CSS自定义样式以解决跨浏览器差异，并通过JavaScript动态更新value属性实现动态进度，同时需同步更新ARIA属性以保障可访问性。
-
需通过系统化手段解析HTML结构：一、用开发者工具查看DOM树；二、识别语义化标签与容器边界；三、借助CSS选择器反向推导层级；四、运行JS脚本遍历输出层级；五、利用第三方工具生成可视化结构图。
-
for循环比forEach和map快，因其是原生语句、无函数调用开销、可缓存长度、支持break/continue；而forEach/map有回调开销、闭包、上下文绑定及新数组分配等成本。
-
用padding-left做嵌套缩进而非margin-left，因其保持父容器事件热区完整、确保hover/click/touch全区域响应；配合CSS变量、clamp()与border-box可控层级、对齐及响应式。
-
用transform:rotate()配合transition和JS控制替代纯CSSanimation，动态计算目标角度、校准扇区中线、强制重绘并状态锁控，可实现精准、不卡顿、防连点的转盘抽奖。
-
应使用<time>标记时间线变更点，其datetime属性须为ISO8601格式（如2024-03-15），内容可为人类可读文本；多个变更点需多个<time>标签，辅以data-version等自定义属性标识版本；“前后对比”需用语义化容器（如<divclass="versionold/new">）配合<del>/<ins>标记小范围文本差异，禁用title或注释替代可见记录。
-
Svelte要求HTML标签全小写、自闭合标签显式闭合、事件用on:click绑定、插值仅支持表达式、逻辑用{#if}和{#each}块；style属性需移至scopedstyle块或加global修饰。
-
align-items:stretch是Flex子项默认等高的关键，只要未显式修改且子项无固定height/min-height，它们会自动拉伸填满交叉轴；需配合min-height:0和box-sizing:border-box确保嵌套与盒模型正确。
-
最直接的方式是用document.getElementById()获取元素再取内容或属性：先通过ID定位元素，再用.textContent、.innerHTML或.getAttribute()读取内容或属性。
-
<p>prefers-color-scheme是CSS媒体查询，用于响应系统暗色偏好：@media(prefers-color-scheme:dark){/暗色样式/}，支持Chrome76+等现代浏览器，值为light/dark/no-preference，需配合data-theme属性避免与手动切换冲突。</p>
-
原生对话框（alert/confirm/prompt）虽零依赖但阻塞主线程、无样式定制且兼容性差，现代项目应优先使用语义化可定制的<dialog>元素或轻量封装方案。
-
移动端表格截断主因是table默认display:table在小屏无法自适应，最优解是不改HTML前提下将table/tr/td/th全设为display:block并用data-label维持行列语义。
-
<aside>是语义标签而非视觉侧边栏，需配合CSS实现布局；Flex推荐main{flex:1}+aside{width:300px;flex-shrink:0}；Grid推荐grid-template-columns:1fr300px并用gap控制间距。
-
Vue.js的readonly是运行时只读提示机制而非硬性访问控制，通过Proxy拦截赋值等操作并在开发环境警告、生产环境静默；无法阻止嵌套对象修改，需递归应用或配合computed、watch、TypeScript等实现可靠保护。
