-
可行但有副作用：display:none会使下拉框彻底脱离渲染树，无法交互、不可见、读屏器不可识别，且表单提交时值仍存在；推荐结合disabled属性使用以确保安全。
-
只有当元素频繁动画且已确认卡顿时才用will-change，须配合transform/opacity并动态启停；滥用会增内存开销、触发回流或过度分层。
-
正确做法是将REM基准值定义为无单位SCSS变量（如$font-scale:16），在:root中转为px，并用rem-calc()函数统一计算rem值，避免硬编码和JS动态设置冲突。
-
JavaScript事件是用户或浏览器操作触发的信号，通过addEventListener为DOM元素添加监听器以响应click、input、keydown等事件，支持多监听、捕获/冒泡控制及事件委托。
-
本文详解为何inline-block元素在设置固定宽度（如500px）时仍会换行堆叠，并推荐使用现代CSSFlexbox布局实现可靠、响应式的左右并排布局，同时兼顾间距控制与适配性。
-
list-style在flex容器中失效是因为flexitem默认display为block/inline而非list-item，导致项目符号被忽略；应改用::before伪元素或CSScounters实现符号/编号，或直接用div+role语义化替代。
-
发布订阅模式通过事件中心实现组件间解耦，支持跨层级通信。使用EventHub类可实现on、emit、off方法，用于订阅、发布和取消事件。组件A触发事件，组件B监听并响应，无需直接引用。建议统一事件常量、及时取消订阅以防内存泄漏，可扩展once功能，大型项目推荐mitt等库。该模式适用于非父子组件通信与全局状态通知，提升代码可维护性。
-
HTML压缩需兼顾浏览器解析规则与可维护性：安全删除非语义空白，省略HTML5允许的冗余标签和属性，慎用自动化工具配置，并优先优化媒体资源与外链脚本而非内联代码。
-
align-items用于设置flex容器子元素在交叉轴上的对齐方式，其常用值包括flex-start（顶部对齐）、flex-end（底部对齐）、center（居中对齐）、stretch（拉伸填满，默认值）和baseline（基线对齐），该属性需应用于display为flex或inline-flex的容器，影响所有直接子元素，常用于实现垂直居中等布局效果。
-
Dreamweaver2026中align属性失效，因HTML5已废弃该内联属性；应改用CSS控制对齐：float、margin:auto、Flex布局或vertical-align等现代方案。
-
CSS动画实现自然飘动效果需用transform位移、8–12s时长、多关键帧偏移、cubic-bezier缓动，并为每个div设不同delay/duration/幅度以避免同步；移动端需加touch-action:none防干扰。
-
卡片悬停上浮最稳方案是transform:translateY(-8px)配合transition:transform.2s–.3scubic-bezier(.4,0,.2,1)，避免重排、兼顾性能与手感，需注意热区连续性、移动端优化及多卡片场景兼容性。
-
应按基础色、语义色、状态色三层抽象定义CSS颜色变量，收敛设计稿色值后写入:root，组件引用语义变量实现设计与开发一致，并通过媒体查询或主题类支持深色模式。
-
JavaScript安全审计需先识别XSS、eval风险、DOM型漏洞、敏感信息泄露及第三方库风险，再结合ESLint、Retire.js、npmaudit、Snyk和CodeQL等工具进行自动化扫描，并通过人工审查外部数据处理、事件绑定、后端信任、闭包暴露及CSP配置等关键点，最终将检测流程融入CI/CD实现持续防护。
-
用CSStransform:scale()配合:hover可实现无JS图片放大，但需设transform-origin:center防偏移，加image-rendering提升清晰度，用cubic-bezier优化缓动，并注意响应式与高DPR适配。
