-
颜色深度优化关键在减少冗余声明而非缩写写法，应通过CSS自定义属性统一语义化管理颜色，禁用硬编码值，避免currentColor隐式膨胀，并依靠工程化规范而非PostCSS自动合并。
-
使用伪元素模拟渐变阴影效果，通过::before创建偏移的渐变层并结合blur和opacity实现柔和投影，再配合多层box-shadow或背景渐变+外发光提升立体感，三种方法分别适用于不同设计需求。
-
CSSSprite通过合并图标减少请求，适合静态图标；图标字体可缩放变色，适合动态场景。根据需求选择：重性能用Sprite，重灵活性用图标字体。
-
必须用CSS的font-size属性替代废弃的<font>标签；px最稳妥，em/rem需注意继承关系；排查文字异常优先看Computed面板；警惕系统字体缩放与viewport设置；响应式推荐clamp()或媒体查询。
-
::first-letter伪元素仅对块级容器中第一个字母或汉字生效，需避免flex/grid布局，支持color等文本属性但background在旧Safari不稳定，首字下沉推荐float+font-size+line-height组合，中文需注意Safari兼容性，禁用伪元素嵌套。
-
嵌套越深浮动越容易“消失”是因为浮动只影响直接父容器，不向上冒泡；每层父容器都需单独触发BFC或清除浮动，否则塌陷导致布局错乱。
-
本文讲解如何通过事件委托替代静态数组绑定，解决动态创建的HTML元素无法响应事件的问题，并提供简洁、健壮、可维护的DOM增删方案。
-
双飞翼布局核心是浮动+负margin，用于实现中间内容优先渲染；HTML中main必须前置并三层嵌套，通过main-wrap占满整行、main设负margin腾出侧栏空间，左右栏用浮动与负margin定位，IE6需zoom:1等hack修复hasLayout问题。
-
批量修改HTML应基于结构理解而非纯文本替换：用正则精准匹配标签边界处理imgsrc，用BeautifulSoup安全修正a标签target属性，用perl或PowerShell处理跨行注释，操作前务必备份并抽样验证DOM结构。
-
最快实现图片模糊用CSSfilter:blur()，语法为filter:blur(3px)，单位必须带px，推荐范围0.5px–8px，动态控制宜改style.filter或切CSS类。
-
flex容器中纯文本不会垂直居中，因文本节点不参与flex布局；需包裹<span>等标签使其成为弹性项，再用align-items:center实现居中。
-
下拉框联动的核心逻辑是监听change事件并动态更新选项。需先清空目标下拉框，再根据映射关系或异步数据填充；注意防重复添加、禁用状态、错误处理及第三方库兼容性。
-
空格本身不干扰爬虫，真正问题是DOM结构脆弱、选择器过度依赖格式或服务端渲染变更；B站div末尾空格致CSS选择器失效，因>要求严格子元素关系；BeautifulSoup保留原始空白，lxml更宽容但xpath可能捕获前导空白；需区分处理文本、属性值及 实体；pandas.read_html对表格最鲁棒；空格频发本质是SSR转向CSR，应优先检测原始响应，转向API或无头浏览器。
-
<p>使用CSSFlexbox结合gap属性可快速构建响应式网格布局，通过display:flex、flex-wrap和gap设置容器，再用flex控制子项宽度，如calc(33.333%-16px)实现三列布局，并配合媒体查询在不同屏幕下调整为两列或单列，避免使用margin防止与gap冲突。</p>
-
text-align-last在Safari15.4前完全不支持，16+仅对块级元素有限支持；Chrome/Edge需配合text-align:justify才生效；Firefox支持最稳定，但中英文混排时对齐逻辑存在差异。
