技术博客
元素用 position 定位后再加 transform 动画，容易出现位移“跳变”、起点错位、动画不连贯等问题。根本原因是 position（如 top/left）和 transform: translate() 作用于同一元素时，浏览器渲染逻辑不同，且二者会叠加影响最终布局位置，尤其在动画起始/结束帧或重排触发时表现明显。
浏览器按 标签出现顺序解析 CSS，顺序错乱会导致样式被意外覆盖或重置失效。比如 normalize.css 放在业务组件样式之后，就无法真正归一化 button 的默认边距。
max-width 不是限制容器“最大能多宽”，而是告诉浏览器：“这个元素宽度最多别超过这个值，哪怕父容器更宽也请停住”。它常用于 、
width: 100% 实现弹性缩放。
嵌套选择器（如 .header .nav a、.card > .content）本身没有语法错误，但过度嵌套会显著拖慢 CSS 解析速度，尤其在低端设备或大型 DOM 树中。浏览器是从右向左匹配选择器的，.header .nav a 实际先找所有 a，再向上逐层验证父级是否满足条件——嵌套越深，回溯越多。
只要父容器设了 display: flex，且子项没显式设置 height、min-height 或 align-self 覆盖，子项就会自动等高——这是 align-items: stretch 的默认行为。很多人以为要手动写 align-items: stretch，其实不写也一样。
Python网页结构分析主要依赖DOM（文档对象模型）解析，核心是把HTML或XML文本转换成树状结构，方便程序定位、提取和修改元素。关键不在于“爬”得多快，而在于“找”得准、取得稳。
HTML5源代码本身不需要编译，但“发行”（即让别人能正确访问和运行）必须解决三个实际问题：文件路径是否有效、浏览器同源策略是否阻断功能、资源是否完整可加载。直接双击打开 index.html 只适用于最简单的静态页面；一旦用了 fetch、import、本地存储或图片/CSS/JS 路径嵌套，就大概率报错——这不是代码写错了，而是没走 HTTP 协议。
不同内核对同一段CSS的解析逻辑可能完全不同：WebKit（Safari、旧版Chrome）和Blink（新版Chrome、Edge）虽同源，但版本迭代后行为有偏移；Gecko（Firefox）对flex子项的min-width默认值处理更保守；Trident（IE）甚至把box-sizing默认设为border-box，而其他所有现代浏览器默认是content-box。这不是“谁对谁错”，而是规范落地过程中的历史分歧。
HTML 注释（）在浏览器解析时被完全忽略，不参与 DOM 构建、渲染或执行，所以不会拖慢页面运行时性能。但它会增加 HTML 文件体积，尤其在开发阶段留下的大量调试注释、TODO 或冗长说明，会提升首字节时间（TTFB）和网络传输开销——这对移动端或弱网用户有实际影响。
可以，浏览器允许你用多个 分别加载不同功能的 CSS 文件，比如 base.css、button.css、modal.css。这在组织上是模块化的，但不是“零代价”的模块化——每个 都是一次 HTTP 请求（HTTP/1.1 下尤其明显），会带来额外的网络延迟和阻塞渲染的风险。