-
盒模型影响元素尺寸和布局，进而影响对齐效果。通过设置box-sizing:border-box可统一尺寸计算方式，避免错位；结合margin:0auto可实现块级元素水平居中；使用Flexbox的justify-content和align-items能灵活控制主轴与交叉轴对齐，推荐用于复杂布局；内联元素或文本则通过text-align实现水平对齐，line-height辅助垂直居中。关键在于统一box-sizing并综合运用布局属性。
-
正确使用transition属性并优化渲染机制可解决hover卡顿。1.使用transition:background-color0.3sease,color0.3sease，避免transition:all；2.添加will-change:background-color,color或transform:translateZ(0)启用硬件加速；3.对渐变背景采用伪元素+opacity过渡，利用GPU加速；4.通过开发者工具检查重绘与帧率，减少布局重排。
-
答案：使用CSStransition属性可实现字体颜色平滑过渡。1.设置初始color和transition，hover时改变color，如.example{color:black;transition:color0.3sease}.example:hover{color:red}；2.transition写在常态样式中确保进出动画；3.可结合focus、active或JS切换class触发；4.使用CSS变量如--text-color支持主题动态切换，注意避免!important干扰。
-
淡入淡出通过opacity与visibility实现下拉菜单平滑显示；2.滑动展开用max-height和overflow隐藏内容，模拟slideDown效果；3.侧边栏使用transform或left配合transition实现滑入；4.动画时长200ms–400ms，推荐ease-in-out曲线，避免复杂动画保证性能，结合:focus-within提升可访问性。
-
使用Rollup打包JavaScript库，需安装rollup及插件如@rollup/plugin-node-resolve、commonjs、typescript，配置rollup.config.js指定input、output多格式（esm/cjs）、external依赖，结合package.json的main/module/types/files字段与tsconfig.json类型生成，执行npmrunbuild构建并npmpublish发布。
-
使用百分比宽度设置容器，配合max-width和min-width控制弹性范围，结合box-sizing:border-box防止布局溢出，并通过max-width:100%使图片自适应，实现流式布局。
-
1、使用LiveServer扩展可实现HTML文件的实时预览，安装后通过右键菜单打开服务器；2、手动双击HTML文件用浏览器打开，适合简单页面但需手动刷新；3、配置tasks.json任务调用系统命令运行当前HTML文件；4、安装CodeRunner扩展后点击播放按钮即可快速运行。
-
HTML5中导航栏不推荐用 ，因其属语义错误：破坏结构职责、影响可访问性、响应式错乱、干扰Flex/Grid布局且维护困难；应改用CSS的margin或gap控制间距。
-
可选链操作符（?.）用于安全访问嵌套属性，遇null/undefined返回undefined而不报错；支持属性访问、数组索引、函数调用和动态属性；常与??搭配提供默认值；不可用于赋值或delete等语句。
-
Sketch无法直接导出HTML，需借助插件或工具：一、Anima插件自动生成响应式HTML/CSS；二、Zeplin提取样式参数辅助手写HTML；三、Sketch2React生成JSX再渲染为HTML字符串；四、Avocode一键导出静态HTML页面。
-
元素实际占用空间由内容、内边距、边框和外边距共同决定，总宽度和高度包含width、padding、border、margin；使用offsetWidth/Height可获取含border和padding的尺寸，getBoundingClientRect()包含margin；box-sizing影响width计算方式，content-box时width仅指内容区，border-box时width包含padding和border，便于控制整体大小。
-
跨域问题由浏览器同源策略引发，主要解决方案有：1.CORS通过服务器设置Access-Control-Allow-Origin等响应头实现，是主流方案；2.JSONP利用script标签不受限特性，仅支持GET请求；3.代理服务器通过Nginx或开发工具配置转发请求，实现同源通信；4.postMessage用于iframe间跨域通信，需验证origin确保安全。生产环境推荐CORS或代理方案。
-
单例模式确保一个类仅有一个实例并提供全局访问点，如通过闭包实现唯一实例；工厂模式封装对象创建逻辑，根据条件返回不同类型对象，提升解耦性；观察者模式建立一对多依赖关系，状态变化时自动通知所有观察者，广泛用于事件系统；装饰器模式动态添加功能而不修改原结构，利用@decorator语法实现日志等横切关注点分离。这些模式借助JavaScript动态特性增强代码可维护性与扩展性，但需结合场景适度使用避免过度设计。
-
本文旨在解决在动态添加或删除列表项时，容器高度突变的问题。通过结合CSS的transition属性和JavaScript动态获取内容高度的方法，实现容器高度的平滑过渡效果，提升用户体验。文章将详细阐述实现原理、提供示例代码及最佳实践。
-
JavaScript执行上下文是代码运行时的环境，决定变量、函数和this的值如何被访问；分为全局、函数和eval三种类型，经历创建与执行两阶段，由执行栈管理上下文切换。
