-
HTML空元素共14个,是W3CHTML5标准明确定义的无内容、无闭合标签元素:area、base、br、col、embed、hr、img、input、link、meta、param、source、track、wbr。
-
linkrel="preload"是最标准可控的图片预加载方式,需在head中静态声明并指定as="image";Image对象适合运行时条件加载与状态监听,二者配合缓存策略和尺寸声明才能实现首屏秒出。
-
shape-outside不生效的首要原因是未设置float;它仅对float:left/right元素有效,且需避免overflow隐藏浮动、使用纯黑白PNG或polygon()替代图像路径,并注意line-height与浏览器兼容性。
-
CMS被淘汰而G1成为分水岭,因其并发标记无法处理浮动垃圾且易退化为SerialGC;G1通过Region划分与RememberedSet实现标记与回收解耦,采用“并发标记+并行复制”模式。
-
必须为盒子设置container-type:inline-size,否则@container和cqw均静默失效;cqw仅在inline-size容器内有效,需配合clamp()使用,且无降级方案。
-
HTML正则测试不能替代HTML验证,因其仅做字符串匹配,不解析DOM、不处理嵌套/实体/注释;W3C验证器则基于真实解析器检查语义合规性;pattern属性使用JS正则规则,需注意转义与隐式^$。
-
steps()动画不能直接用CSS变量控制,因为浏览器无法在animation-timing-function的函数参数中解析var()为有效数值,导致退化为ease或失效;需通过@property(Chrome103+/Safari16.4+)间接调控或JS动态重写animation字符串实现真正动态调速。
-
外边距合并不是bug而是CSS规范行为:垂直相邻块级元素的margin-top/margin-bottom会取较大值合并。典型场景有相邻兄弟元素、父子塌陷、空元素自合并;推荐用BFC(如display:flow-root)、统一设margin-bottom、gap或微调padding/border来隔离。
-
直接写min-width:768px易导致“魔法数字”问题,应改用CSS变量统一管理断点,如--breakpoint-md:768px,并在:root中定义、媒体查询中以@media(min-width:var(--breakpoint-md))安全调用。
-
iframe不适合做布局,因其破坏语义、可访问性、SEO和响应式;应使用语义化标签配合CSSFlex/Grid,或fetch动态加载HTML片段。
-
响应式设计之所以在现代网页开发中不可或缺,是因为它能确保网站在不同设备上均呈现最佳效果,提升用户体验,适应移动优先的搜索引擎排名规则,并降低维护成本。1.通过添加viewport元标签使页面适配设备宽度;2.使用百分比、Flexbox或Grid等弹性布局替代固定像素单位;3.为图片和视频设置max-width:100%实现媒体响应;4.利用媒体查询根据屏幕特性调整样式;5.优先采用移动端优先策略优化代码结构。运行HTML文档除双击或拖拽外,还可使用VSCode的LiveServer、Node.js的htt
-
1、可通过浏览器直接打开HTML文件预览,右键选择用Chrome等浏览器打开即可;2、也可通过浏览器菜单的“打开文件”功能加载本地HTML文件;3、双击文件可利用系统默认程序快速查看,建议将浏览器设为默认打开工具;4、使用VSCode等编辑器配合“在浏览器中打开”或LiveServer插件实现边写边看;5、对于含JS、CSS或AJAX的复杂页面,应搭建本地服务器运行,如通过Node.js安装live-server工具,在命令行启动服务后访问localhost:8080查看效果。
-
Proxy实现响应式核心是通过get/set拦截建立依赖关系:get中用track()收集当前activeeffect到WeakMap管理的依赖集,set中用trigger()触发对应key的所有副作用;需递归代理、特殊处理数组、配合effect包装函数自动注册与清理依赖。
-
支持,但需初始态和悬停态的border-width均使用带单位的数值(如2px→6px),且保持border-style和border-color不变;若失效,可改用outline-width或box-shadow模拟。
-
模块化+状态驱动实现A/B测试的清晰切换与高可维护性,通过解耦变量、策略、渲染层并以统一状态控制行为流向。