-
用position:absolute+top:0+left:0+width/height:100%使图片叠于父容器左上角，父容器需设position:relative和明确高度，配合z-index与opacity切换，预加载图片并用object-fit:cover防变形。
-
HTTPS页面加载HTTP资源会被现代浏览器默认阻止，主动混合内容（如script、iframe）直接报错阻断，被动内容（如img）在Chrome94+也统一阻止；应将所有http://替换为https://，并检查API、第三方SDK及构建流程。
-
dfn标签仅在术语首次出现且紧邻完整定义语句时使用，必须嵌套于语义化块级元素中，优先取title属性值作为定义内容，错误用法会导致语义断裂与辅助技术失效。
-
margin-left:auto靠右生效的前提是元素处于干净的flex上下文：父容器需为display:flex且未被justify-content等覆盖，目标元素须为直系子项、无DOM干扰节点，并在flex-direction:row下使用。
-
答案：在VisualStudio中编写HTML需通过浏览器预览效果。方法一：右键文件选择“在浏览器中查看”，用默认浏览器打开；方法二：手动将HTML文件拖入浏览器窗口，适合频繁调试；方法三：使用VSCode的LiveServer插件实现热重载，保存后自动刷新。注意F5不适用于纯HTML项目，避免路径含中文或空格，确保引用资源路径正确。
-
TWA无需修改前端代码，但需严格满足Google校验规则：PWA须配置standalone/minimal-ui显示模式、HTTPS全站加密、ServiceWorker激活；Android侧须用TrustedWebActivityIntentBuilder构建Intent，正确设置颜色、签名及DigitalAssetLinks验证。
-
正确使用HTML标签和属性实现图片语义化布局，可提升可访问性、SEO与代码维护性。1.内容型图片用<img>配alt描述，如产品图；2.装饰性图片通过CSSbackground-image实现；3.复杂图表结合aria-describedby或figure与figcaption提供详细说明；4.响应式中利用srcset、sizes优化加载，配合loading="lazy"提升性能；5.优先使用WebP等现代格式并通过<picture>回退；6.alt文本需具体简
-
flex容器默认由子元素内容撑开高度，若子元素无足够内容或脱离文档流，则可能无法撑开；通过避免绝对定位、设置min-height、保证父级高度及合理使用align-items可控制容器高度。
-
ShadowDOM的closed模式不提供强主权保护，仅使shadowRoot返回null；真正沙箱需iframe、StrictCSP和ShadowDOM协同，推荐open模式配合显式契约与三层防线。
-
JavaScript性能优化的核心是减少不必要的计算和渲染，关键在于缓存结果（如memoization）、按需执行（节流/防抖）、批量更新（DOMFragment、React批处理）、避免强制同步布局（读写分离、requestAnimationFrame）。
-
margin用于控制元素外边距，提升页面布局清晰度；支持四方向设置或统一设置，可使用px、%、auto等值；通过margin:0auto可实现块级元素水平居中；需注意垂直方向相邻元素的margin合并问题，常取较大值，可通过设置单边margin、添加border或触发BFC避免。
-
CSS变量在JS中通过style.setProperty()修改、getComputedStyle().getPropertyValue()读取，需注意拼写、作用域、优先级及SSR/CSR时机；color-mix()不可在JS调用，hsl()可字符串生成；暗色模式闪动应预设data-theme并过渡具体属性。
-
面板根元素用panel，子元素统一为panel__header/body/footer；状态用panel--collapsed，尺寸修饰符需成套作用于各子元素，body需设flex:1和min-height:0防塌陷。
-
::file-selector-button是伪元素，不接受class选择器，仅支持属性、ID或标签+属性定位；仅允许部分样式属性，需用padding撑开视觉区域；Firefox不支持，须降级兼容；必须保障可访问性，禁用display:none，保留焦点环与语义。
-
content属性不支持var()函数，仅接受字符串字面量、attr()、counter()和counters()；伪元素中使用var(--icon)属语法错误，浏览器会静默忽略或报Invalidpropertyvalue。
