-
放大镜效果必须用position:relative包裹图片容器，因为绝对定位的放大镜需相对于已定位祖先定位；若父容器未设该属性，放大镜会错位到body；且应设在容器而非img上，因img是替换元素。
-
硬过渡条纹的关键是相邻色标值完全相等，如#00025%,#fff25%，浏览器不插值而直接拼接；若用px单位需防subpixel渲染发虚，推荐统一用百分比定义色标并配合background-size控制密度。
-
使用outline而非border可避免布局变化，结合CSS动画实现无干扰的视觉反馈。通过@keyframes控制outline-width、offset和opacity，创建按钮悬停脉冲与输入框焦点高亮动画，提升键盘导航体验与可访问性。需注意旧浏览器兼容性、避免过度闪烁，并确保颜色对比度达标，以兼顾性能与用户体验。
-
HTML下拉菜单即<select>元素，需用name属性确保提交，value设标识符而非显示文本，disabled禁用但不提交值，multiple支持多选但体验差，placeholder无效须用空option替代。
-
用gap属性可统一控制Grid容器内卡片间距，避免margin冲突与不一致；需确保父容器为display:grid、清除子项冗余margin/padding，并正确使用gap简写或行列分写语法。
-
本文详解如何通过formRef在外部组件或事件中安全、高效地读取或修改Unform表单字段值，避免使用document.getElementById()，支持实时获取单个字段（如getFieldValue('cpf')）或全部数据（getData()），并附完整用法示例与关键注意事项。
-
FIMO生成的HTML报告不支持网格布局，所有样式为固定CSS，表格使用<table>而非display:grid；如需网格效果须手动修改HTML或换用MEME-ChIP等工具。
-
所有浏览器都支持的CSS颜色关键字仅有transparent和16个HTML4标准色（如red、blue）；其余如orange、rebeccapurple等在IE8或旧版WebView中会静默失效，且darkslategrey等英式拼写不被IE8识别。
-
内联关键CSS能消除白屏和闪动，因其使首屏样式随HTML同步解析，避免CSSOM构建阻塞渲染；关键CSS仅含首屏必需规则，需工具（如Critters）提取并人工校验，非关键CSS应preload后注入，且注意缓存与框架适配。
-
本文详解Bootstrap5中实现子div垂直底对齐（bottom-aligned）的正确方法，重点纠正常见误区（如误用align-bottom或孤立使用align-self-end），并提供基于Flexbox的标准解决方案。
-
能，background-repeat:no-repeat确实阻止背景图重复，但仅对单张背景图且容器大于图片原始尺寸时生效；多背景、background-size或background-position设置不当易引发误解。
-
使用<details>和<summary>标签可原生实现内容折叠与展开，无需JavaScript；2.<summary>为标题且必须是<details>的第一个子元素，默认折叠，添加open属性可默认展开；3.可通过CSS隐藏默认标记并自定义指示符样式，如用::before实现加号/减号切换；4.原生支持键盘导航与屏幕阅读器，具备良好无障碍性，但自定义时需确保视觉提示清晰；5.可通过JavaScript监听toggle事件实现动画、异步加载、状态记忆及手风琴
-
HTML属性width/height仅设初始尺寸，CSS优先级更高；响应式需用srcset/sizes选资源，object-fit控缩放，容器需明确宽高或aspect-ratio。
-
可通过CSS媒体查询orientation特性检测横竖屏：orientation:landscape匹配横屏（宽≥高），portrait匹配竖屏（高＞宽），判断基于视口尺寸而非物理传感器；可叠加min-width等条件提升精度；JavaScript可用matchMedia或resize事件动态监听，需配合viewportmeta标签确保生效。
-
本文详解如何改造W3Schools表格搜索脚本，使其支持对表格中每一行的所有<td>单元格进行并行匹配，而非仅搜索首列，从而真正实现“整表搜索”功能。
