-
Bulma按钮无样式主因是未引入normalize.css；is-fullwidth需配合.is-expanded生效；columns底部对齐应避免设height，改用flex工具类；自定义主题色须在导入bulma前覆盖Sass变量。
-
justify-content:space-around仅对display:flex或inline-flex容器生效；需确保容器设display:flex，按钮为Flex项目，避免脱离文档流，并注意space-around与space-between的留白差异及响应式处理。
-
图标无法显示最常见原因是iconfontCSS文件未加载成功；需检查Network中CSS请求状态、link标签路径与属性是否正确、类名拼写是否一致，以及是否存在样式覆盖或安全策略拦截。
-
要精准选择多类元素并结合伪类实现动态样式，需掌握类选择器的“与”逻辑及伪类的应用规则。使用连续书写类名（如.btn.danger:hover）可选中同时具备多个类且处于特定状态的元素，适用于悬停、焦点、激活等交互场景。类名顺序不影响匹配，伪类应置于类选择器之后以提升可读性，避免空格误用导致后代选择器错误。典型应用包括按钮状态、表单验证和导航高亮，合理组合可减少HTML冗余，增强样式灵活性。
-
直接修改video的src属性并调用load()方法可动态切换视频源，推荐使用source标签灵活控制多格式兼容，需注意自动播放限制与跨域问题。
-
后代选择器通过空格选中任意层级的嵌套元素，如.containerp{}会影响所有后代p元素；而子选择器用>仅作用于直接子元素，需注意作用范围避免样式冲突。
-
静态场景优先用#FF5733：体积最小、解析最快、全浏览器兼容；需透明度时改用rgba()或现代#RRGGBBAA，避免HEX简写偏差和rgb()无效alpha。
-
HTML标签未闭合或嵌套错误导致页面错乱，需结合编辑器高亮、缩进层级、开发者工具DOM验证及HTML5验证器综合排查；自闭合标签误加子节点、第三方代码闭合错误等易被忽略。
-
响应式编程是一种基于数据流和变化传播的编程范式，核心是通过Observable实现对随时间变化的数据流的监听与组合。它利用如map、filter、debounceTime、switchMap等操作符处理异步事件，广泛应用于表单验证、搜索建议和状态管理。现代框架如Vue和Angular通过代理或getter/setter实现数据变化自动更新视图，借助effect等副作用函数追踪依赖并在数据变化时自动执行响应逻辑，使代码更声明化且减少回调嵌套，但需注意取消订阅以避免内存泄漏。
-
判断并高亮当前导航项需基于URL路径匹配：用window.location.pathname与链接路径前缀比对（startsWith），注意处理子目录部署、SPA路由响应式同步（如ReactRouter的NavLink或useMatch），并排查CSS优先级问题。
-
nth-of-type能选中子元素里的第n个p，但只按同类型兄弟元素位置计数，不考虑嵌套层级或非目标标签节点。
-
现代博客首页应使用语义化HTML标签：header包导航和标题，main放文章列表，aside放分类/关于/友链，footer放版权和备案信息；CSS布局优先选Grid实现三区域响应式，避免float或绝对定位；文章卡片需用white-space、-webkit-line-clamp和word-break防溢出；断点设为480px和768px~1023px两档，字体用rem/em保证缩放适配。
-
自定义元素和影子DOM是WebComponents核心，前者通过类继承HTMLElement创建新标签，后者用attachShadow隔离内部结构，实现封装复用。
-
border必须同时指定width、style、color才生效；letter-spacing控制字符额外间距，不继承；line-height和padding共同决定文字与边框距离；flex的align-items比line-height更可靠实现垂直居中。
-
transition不能单独设置移出动画，它只响应属性变化；正确做法是将transition声明写在:hover中实现慢入快出，基础状态不写以确保移出时瞬间回弹。
