-
dir属性是HTML原生方向开关,必须显式设于根元素或容器,不可被CSS的direction替代,因其触发Unicode双向算法,影响光标、表单、焦点流及屏幕阅读器解析。
-
Math.hypot()的核心价值是安全计算多维欧氏距离,通过缩放算法避免平方导致的溢出或下溢;支持任意维度,计算两点距离需先求坐标差再传入;对Infinity、NaN、零等特殊值有明确定义。
-
外边距合并是相邻块级元素垂直margin取较大值而非相加的规范行为;常见于div堆叠、h1后p、父子间;可用BFC阻断,推荐display:flow-root。
-
JavaScript类型转换分三种:转字符串(如String(123)→"123")、转数字(如Number("123")→123)、转布尔值(如Boolean(0)→false);隐式转换发生在运算中,如"6"-2→4,[]+{}→"[objectObject]";核心原则是拼接转字符串、数学运算转数字、条件判断看真假值。
-
纯CSS实现Tab切换不能仅靠float,因其仅为布局属性,无法响应交互或控制显隐;真正生效的是:checked、:target等伪类配合HTML结构实现状态切换。
-
HTML语义化标签不直接提升SEO权重,但用错会扣分;<main>明确标识核心内容,Google移动优先索引优先提取其内文本与标题层级;<h1>至<h6>构建内容骨架,须层级连续、唯一<h1>;<figure><figcaption>联合提升图文长尾词覆盖;<title>与<h1>需语义一致且动态生成。
-
响应式断点应基于页面内容实际坍塌点而非设备型号,如导航换行、卡片错位等临界宽度;需在ChromeDevTools中拖动滑块观察布局变化,记下像素值后向上取整,优先使用min-width移动优先逻辑,并确保设置viewportmeta标签。
-
transform-origin是独立CSS属性,须与transform并列声明,作用于整个变换链;双值语法为X后Y,支持关键字/百分比/像素混用;非默认原点用像素值会增加GPU计算负担。
-
HTML通知仅为前端展示层,真后台推送需ServiceWorker+WebPushAPI;NotificationAPI仅支持页面开启时的桌面通知,iOSSafari完全不支持;WebPush需HTTPS、用户授权、后端VAPID推送服务配合。
-
grid容器上设overflow无效是因为默认不创建BFC,需在子项设min-width:0/min-height:0并配合overflow才能生效,或在网格轨道用minmax(0,1fr)控制弹性。
-
X-UA-Compatible已完全失效,仅对IE8–IE11有效,现代浏览器及Edge均忽略;IE11停更后该标签被弃用,正确设置需放<head>最前或通过HTTP头发送,真正兼容难点在于CSS、JS等底层特性支持。
-
动态导入与预加载可提升前端性能。通过import()按需加载模块,减少首屏体积;结合webpackChunkName、webpackPrefetch等魔法注释命名并预取chunk;路由级组件和非关键功能(如图表)采用动态加载,辅以空闲时预加载高概率模块,优化资源加载时机,加快响应速度。
-
background-image是最常用且可控的背景图设置方式,需配合background-size、background-position使用,确保元素有宽高、路径正确,并优先用相对路径;禁用background-repeat,推荐cover模式;不可用img替代,因语义与行为冲突;注意跨域、本地协议限制及响应式适配。
-
Safari对calc()结果执行向下取整(floor),导致宽度/高度差1px;Chrome、Firefox则四舍五入或保留小数,这是WebKit布局阶段的数值处理策略,并非bug。
-
Object.defineProperties可一次性定义多个属性并配置getter等描述符;需传入属性名到描述符对象的映射,描述符中含get函数则自动设value为undefined且writable为false。