-
在JavaScript中，func表示对函数对象的引用，而func()表示立即调用该函数并返回其执行结果；这一区别直接影响赋值、事件绑定、模块导出等关键场景的行为。
-
justify-self用于Grid布局中控制子元素在行内轴（横轴）的对齐，如center、start等；align-self在Grid和Flexbox中均有效，控制块轴（纵轴）对齐，如center、flex-start。前者仅适用于Grid，后者通用，优先级高于父容器设置。
-
答案是使用标签或CSSwhite-space属性处理HTML换行。通过替换\n为实现换行显示，或用pre、pre-line、pre-wrap等CSS属性保留格式，用户输入需先转义再转换，确保安全与效果兼顾。
-
图片与文字使用float错位是因基线对齐和块级特性导致，可通过inline-block+vertical-align或flex布局解决，推荐用flex实现垂直居中对齐。
-
最稳妥的显示方式是用iframe；动态创建并设srcdoc属性可内联渲染同源HTML字符串，跨域则需后端配置CORS或frame-ancestors，IE不支持srcdoc时可用BlobURL降级，局部渲染推荐DOMParser解析后挂载body子节点。
-
直接套用SVG作border-image会变形，因stretch拉伸破坏虚线节奏；需拆path为四段、留空四角，用border-image-slice:20fill并确保viewBox匹配border-width，禁用stroke-linecap:round，且border-radius≤border-width/2。
-
滚动文字逐字显现本质是字符级定时插入，需用JS将字符串转为Unicode安全数组并以requestAnimationFrame或带时间戳的setTimeout逐个写入DOM，避免split('')导致emoji等乱码。
-
ServiceWorker是运行在浏览器后台的事件驱动型脚本，支持离线缓存、网络请求拦截与推送通知。需HTTPS注册，生命周期为注册→安装→激活→等待→控制页面，无法访问DOM，依赖fetch/cacheAPI实现预缓存与运行时缓存策略。
-
opacity作用于整个元素及其内容，取值0到1；rgba或hsla可实现背景或边框透明而文字不透明；层叠时半透明元素会混合颜色；需整体透明用opacity，仅背景透明用rgba，结合使用可提升视觉层次。
-
浮动元素高度不一致导致父容器塌陷，因脱离文档流后父容器无法感知真实高度；可通过伪元素清除浮动配合padding-bottom与负margin实现视觉等高，或用Flexbox替代，必要时再用JS动态同步高度。
-
必须显式设置border:none和outline:none，并在:focus中同步重置；iOSSafari需加-webkit-appearance:none和不透明背景色，同时检查padding与background避免视觉消失。
-
<p>HTML注释必须用<!---->且不可含--或>，禁止嵌套，否则提前终止导致解析异常；script/style内无需HTML注释，现代浏览器原生支持。</p>
-
伪类和伪元素是控制DOM表现层的最小干预单元；::before等伪元素必须用双冒号，:focus-visible按输入方式动态生效，::selection仅支持background-color和color，:is()取最高权重而:where()恒为0。
-
columns属性需确保容器为块级流且高度足够，优先用column-count固定列数或column-width实现自适应，配合break-inside:avoid防跨列断裂，column-gap统一用px单位并注意打印回退。
-
Gatsby构建后CSS未内联，因未在gatsby-ssr.js中实现onRenderBody函数接管HTML渲染并注入style标签；Hugo需用resources.Get+safeCSS在模板中输出编译后CSS内容。
