-
使用HTML与CSS可创建响应式标签云，通过data-weight控制权重样式，flex布局实现自适应，提升用户体验与SEO。
-
WebStorm通过内置服务器和浏览器配合实现HTML预览与调试。1.右键HTML文件选择OpeninBrowser，自动启动本地服务器并预览；2.启用LiveEdit功能需安装JetBrains插件，点击Debug图标实现实时编辑更新；3.在JS代码行设断点，通过Debug模式运行可暂停执行、查看变量及调用栈；4.可自定义JavaScriptDebug配置，保存后快速启动。核心是结合浏览器与调试工具提升前端开发效率。
-
最常用方法是设display:inline-block，因其既能设置宽高、内外边距，又能同行排列；而inline无法设置宽高和上下margin，块元素默认独占一行。
-
用transform:scaleX(-1)可实现背景图左右翻转，但会连带翻转内容；若仅翻背景，应使用伪元素方案：将background-image移至::before，对其应用scaleX(-1)，并设position:absolute、四方位定位及z-index:-1。
-
CSS层叠由来源、重要性、特异性、顺序共同决定，特异性（如ID>class>元素）常是覆盖主因；!important仅提升单声明重要性，滥用损害可维护性；可持续策略是提升选择器特异性而非依赖!important。
-
使用transform配合transition可实现元素平滑移动，推荐translate()因性能更优，避免频繁触发重排，适用于悬停、菜单等场景，保持过渡时间0.2s~0.6s体验更佳。
-
JavaScript（Node.js/Deno）的ES模块规范不支持类似Java的private/protected访问修饰符，无法原生限制某export仅被指定文件导入；真正的模块封装需通过架构设计（如依赖注入、模块封装层或作用域隔离）来实现。
-
卡片翻转不顺畅的根源在于未开启硬件加速、transition未写在默认状态及perspective位置错误；需为父容器设preserve-3d与perspective，翻转元素加backface-visibility:hidden和will-change:transform，并确保transform-origin:center、结构扁平、使用自然贝塞尔曲线。
-
Promise是异步操作的底层抽象，async/await是其语法糖；不理解Promise的状态机（pending/fulfilled/rejected）和microtask机制，就无法正确使用错误处理、并发控制与调试。
-
HTML5的play()函数本身不支持互动视频逻辑，仅触发播放，真正的互动需用JavaScript控制currentTime、pause()、play()及DOM层叠来模拟分支；必须由用户手势首次触发play()，否则抛出NotAllowedError。
-
CSScolor属性支持四类写法：关键字（140个，如red、rebeccapurple）、十六进制（#rrggbb、#rgb、#rrggbbaa）、RGB/RGBA、HSL/HSLA；兼容性好但可维护性、透明度控制和精度各异。
-
按需引入CSS能显著提升页面加载速度和用户体验，尤其在大型项目中。全部引入方式简单直接，适合小型项目，但会导致资源浪费、加载变慢；而按需引入通过只加载当前所需样式，减少初始负载、提升FCP和LCP性能指标，优化渲染阻塞与缓存利用。常见实现方案包括结合构建工具的代码分割、CSSModules、CSS-in-JS、动态import()及关键CSS内联+异步加载。尽管存在FOUC、构建复杂、样式重复与调试困难等挑战，但可通过内联关键CSS、采用模块化方案、使用成熟框架配置和规范管理等方式有效规避。该策略是现代前
-
语义化按钮首选<button>而非<div>或<a>伪装；必设type属性；仅允许phrasingcontent嵌套；禁用时同步视觉反馈；移动端需处理300ms延迟与点击穿透。
-
HTML5中value属性用于设置或获取表单元素当前值，行为因input、textarea、select等类型而异；contenteditable元素需模拟value，非表单元素推荐用data-value与dataset配合。
-
flex项宽度“算不准”是因box-sizing默认为content-box，width不包含padding/border；应设border-box或全局重置；gap比margin更适配flex间距；内容溢出时加min-width:0可解；align-items居中失效常因容器padding干扰。
