-
script标签引入JS需谨慎：内嵌脚本放head会阻塞渲染；外链默认同步阻塞，defer异步下载后按序执行，async下载完立即执行；行内事件有作用域、复用和XSS风险；动态创建script仍可能阻塞；路径错误仅静默失败。
-
flex-wrap属性用于控制flex容器内子元素的换行行为，其常用值为nowrap（不换行）、wrap（向下换行）和wrap-reverse（向上换行）。通过结合flex-direction、gap、align-content等属性，可实现如多行卡片布局、聊天消息流等响应式设计场景，有效解决子元素溢出问题并提升布局灵活性。
-
srcdoc属性需提供完整合法HTML文档结构，包含DOCTYPE、html、head、body；引号须转义，禁止外部资源引用，JS/CSS须内联，不支持IE，需fallback，存在XSS风险。
-
fixed底部菜单常因忽略安全区域而被遮挡，需用padding-bottom:env(safe-area-inset-bottom,0px)留出空间，并配合z-index和层叠上下文排查确保显示正常。
-
rel="preload"用于高优先级预加载关键资源，需指定as属性和crossorigin（字体必需），仅限阻塞关键路径的资源；搭配font-display:optional可避免FOIT/FOUT，JS模块需配合import或type="module"使用。
-
W3C验证器仅检查HTML语法规范性，不保障语义、可访问性或JS运行效果；应使用https://validator.w3.org/nu/验证构建后的dist/index.html，区分真错误（如缺alt）与框架指令等误报，且无法发现DOM动态问题、ARIA拼写错误等。
-
答案：:not()伪类可排除特定元素实现精准样式控制。通过:not(选择器)语法，如p:not(.highlight)或input:not([disabled])，能为不匹配条件的元素应用样式，常用于跳过特殊类、状态或结构的元素，结合属性与结构选择器可实现高级过滤，但需注意仅支持单个简单参数、不兼容旧版IE且不可选伪元素，现代浏览器广泛支持，合理使用可提升代码简洁性与维护性。
-
不加async或defer的script标签会阻塞HTML解析：浏览器遇到时立即暂停解析，下载并执行脚本后才继续，导致白屏和DOM访问失败；内联与外链脚本均如此，且按文档顺序串行执行。
-
currentColor方案最轻量兼容性好，但仅适用于内联SVG；因img引入的SVG处于隔离上下文，无法继承父级color值，故必须内联或改用CSS变量等替代方案。
-
animation-delay是实现stagger效果最轻量方式，需配合:nth-child或CSS变量动态设置不同延迟，不可全局统一；transition-delay不适用复杂序列动画，且无法与@keyframes配合。
-
本文详解React列表渲染中因误用数组索引（index）作为key所致的删除异常问题——点击任意行“删除”按钮却总是删掉最后一项，并提供基于唯一ID的健壮修复方案。
-
聊天气泡布局核心是用margin-left:auto和margin-right:auto控制左右对齐，禁用float和absolute；尾巴用双层伪元素三角实现；长文本需max-width:80%并按语言设置换行；滚动需nextTick确保DOM渲染完成。
-
纯CSS实现hamburger→×动画的关键是用伪元素构建三线结构并协同transform：中间线opacity:0，上下线分别rotate(45deg)/rotate(-45deg)加translate交汇成×；需统一用transform控制偏移以避免原点漂移，同时排查pointer-events和z-index导致的点击失效。
-
函数柯里化是将多参数函数转换为单参数函数链，如curriedAdd(1)(2)(3)；偏应用是固定部分参数生成新函数，如partial(multiply,2)(3,4)。两者均提升复用性，但柯里化强调逐步求值，偏应用侧重预设参数。
-
最稳妥的文字大小设置方式是用rem单位，需配合根元素font-size和viewportmeta标签；px适合像素级微调但不适用于正文；em和%易因嵌套失控，应慎用。
