-
border会占位因默认box-sizing:content-box下宽度不包含边框；可用box-shadow模拟视觉边框以避免撑大布局，如box-shadow:0002px#333实现不占位边框；但box-shadow无法响应交互且不支持虚线，推荐优先使用box-sizing:border-box使border包含在宽高中，结合两者可灵活控制布局与视觉效果。
-
HTML5盒子模型调试需掌握五种技巧：一、用box-sizing:border-box统一盒模型；二、margin负值配合绝对定位实现居中；三、padding-top百分比维持响应式宽高比；四、border与outline协同消除边框间隙；五、box-shadowinset模拟内边距。
-
:in-range伪类仅对原生支持范围限制的输入类型生效，需确保type属性匹配且min/max为HTML静态属性，value值格式正确并处于边界内。
-
无法直接对HTML画中画（PiP）原生控件进行样式化，因为浏览器出于安全、用户体验一致性和技术实现复杂性的考虑，严格限制了对系统级UI元素的样式控制，尤其是画中画窗口本身不属于网页DOM结构，导致CSS无法直接作用于其内部控件；真正的解决方案是构建自定义视频播放器UI，通过JavaScript调用requestPictureInPicture()和exitPictureInPicture()方法来控制画中画状态，并结合自定义按钮和样式实现完全可控的视觉效果；而:pseudo-classpicture-in
-
CSS路径错误的核心是参照系混淆：href始终相对于HTML文件位置，而非CSS文件自身；推荐用以/开头的站点根目录相对路径，本地预览需通过服务器运行，避免混用../等易错路径。
-
跳表通过多层索引实现高效查询，从最高层开始逐层跳跃并缩小范围，平均时间复杂度为O(logn)。其核心参数包括晋升概率p（通常0.5）、最大层数max_level（约log_{1/p}N）、高质量随机数生成器及合理节点结构，确保查询、插入、删除的高效平衡。相比平衡二叉树，跳表实现更简单，并发性能更优，广泛应用于Redis、LevelDB等系统。
-
需要清除浮动是因为浮动元素脱离文档流导致父容器高度塌陷，影响布局；通过clearfix技术可在多浏览器中恢复父容器高度，保持结构稳定。
-
flex-basis设置项目初始尺寸，flex-grow控制剩余空间分配比例。将flex-basis设为0并用flex-grow定义权重，可实现精确比例布局，如三个子元素按1:2:3分配空间时分别设置flex:110、flex:210、flex:310，最终宽度分别为总空间的1/6、2/6、3/6；等分容器时可统一设flex:110，保留内容最小宽度则用flex-basis:auto，配合min-width防止过度压缩，关键在于理解flex-basis为起点、flex-grow决定扩展能力。
-
本文详解如何使用Bootstrap5的Flexbox工具类（如justify-content-center）精准居中包含标题、段落和表格的整块内容，解决因表格默认左对齐导致的布局偏移问题。
-
通过启用RemNote的CustomCSS功能，可为嵌套笔记添加层级高亮样式：进入设置→Appearance→开启EnableCustomCSS→编辑并粘贴CSS代码，利用不同背景色与边框颜色区分HTML结构层级（如蓝色表顶层、黄色表主干、红色表容器、灰色表深层嵌套），结合<html>标签命名与emoji图标提升可读性，实现可视化HTML结构笔记。
-
实现无限滚动的核心是监听滚动事件并适时触发加载，需结合scrollTop、clientHeight和scrollHeight判断触底，配合防抖与加载锁防止重复请求，最后插入新数据并更新分页参数。
-
直接双击HTML文件即可用浏览器运行，无需编译或服务器；2.可右键选择浏览器打开或在地址栏输入file:///路径访问；3.开发时推荐使用VSCodeLiveServer、Python或Node.js启动本地服务器避免跨域问题；4.部署上线可将项目上传至GitHubPages、Vercel或Netlify获得公网链接供他人访问。
-
真正可重用的函数需满足单一职责、无副作用、输入输出明确；只依赖参数、不修改入参、错误显式处理、合理使用默认参数与解构；函数式编程提升测试性、组合性、并发安全性与可调试性。
-
必须掌握操作HTML元素的五种核心方法：一、通过ID精准获取并修改单个元素；二、通过类名批量操作多个元素；三、用querySelector系列灵活选择任意CSS匹配元素；四、动态创建并插入新元素；五、安全移除或替换现有元素。
-
input在Flex中被压缩是因默认min-width:auto导致内容宽度极小，解决方法是显式设置min-width（如0、120px或配合flex:1），并建议组合flex-shrink:0或flex:11auto以确保稳定显示与交互。
