-
最基础可靠的获取HTML页面方式是直接用浏览器打开HTML文件或通过本地服务器访问。file://协议适合静态页但禁用fetch等特性；Python内置服务器可模拟真实环境；curl/fetch适用于远程获取但受同源和JS渲染限制；关键在确保路径正确与脚本执行。
-
IE8及以下用filter:alpha(opacity=XX)会导致子元素强制继承透明度，唯一有效解法是给关键子元素设置纯色background-color（如#fff）抵消灰度，禁用rgba()和opacity因IE6–IE8不支持。
-
PWA必须包含start_url、display、icons（192x192和512x512PNG）、name、short_name字段，且serviceworker需在HTTPS下注册并处理fetch事件。
-
当使用text-indent:-20px配合margin-left:20px实现悬挂缩进时，若前有左浮动元素（如广告栏），文本可能异常覆盖其上；根本解法是通过clear:both强制段落从浮动元素下方开始流式布局。
-
真正稳的轮播方案是requestAnimationFrame+时间戳控制，它与屏幕刷新同步且切后台自动暂停；CSS轮播需用transform+opacity、will-change优化，避免重排闪动；按钮交互要防冒泡、双事件监听；图片加载失败须用onerror处理并校验naturalWidth等字段。
-
图片不居中是因浏览器默认inline样式导致，需设display:block;margin:0auto;或父容器display:flex;justify-content:center;，denoserve不干预样式与响应头。
-
clientX相对于视口左上角，不随滚动变化，适用于悬浮提示、菜单定位；pageX相对于文档左上角，随滚动变化，适用于绘图、锚点记录；需注意IE8兼容性及screenX等坐标差异。
-
答案：通过transition属性实现按钮悬停时背景色和文字颜色的平滑过渡。首先设置基础样式，包括背景色、文字色、边框等；然后添加transition控制background-color和color在0.3秒内缓动变化；接着定义:hover状态下的颜色值，触发渐变动画；最后建议明确指定过渡属性以避免性能问题。
-
sticky元素不生效的三大主因：一是父容器或祖先设置了非visible的overflow（如hidden、scroll），切断滚动参考；二是父容器高度为0或未定义，导致无滚动上下文；三是sticky元素自身应用了transform/filter等触发新层叠上下文的属性。
-
requestAnimationFrame是浏览器原生动画API，按屏幕刷新节奏自动调度回调，60Hz下约每16.7ms执行一次，后台自动暂停，合并DOM更新以减少重排重绘，并智能降频保帧率稳定。
-
外边距塌陷是CSS规范定义的垂直相邻块级元素margin合并行为，发生在父子或兄弟块间；行内、浮动、绝对定位元素不参与；可用BFC（如display:flow-root）或border/padding/flex等轻量方式解决。
-
fillRect()和strokeRect()可直接绘制矩形，无需路径操作；画圆必须用arc()配合beginPath()、fill()/stroke()；自定义图形需moveTo()+lineTo()+closePath()组合，并注意路径状态管理。
-
ChromeDevTools断点调试比console.log更可靠，因其不改变异步时序、可观察闭包变量与调用栈；推荐使用debugger语句或条件断点，并结合Network面板、unhandledrejection监听、可选链及Ignorelist提升调试效率。
-
CSStransition通过定义属性、时长、速度曲线和延迟，实现元素状态间的平滑过渡，常用于交互式微动画；结合transform可提升性能，适用于hover、点击等状态变化，而复杂多帧或自动循环动画则推荐使用CSSanimation。
-
<p>box-sizing:border-box是flex对齐稳定的地基，需全局设置为*{box-sizing:border-box;}；慎用margin改用gap控制间距；显式声明align-items避免baseline偏差；用outline和背景色可视化调试。</p>
