-
兼容旧浏览器主要通过使用polyfill和降级策略实现,其核心是渐进增强与优雅降级理念;2.Polyfill通过JavaScript模拟新特性,填补旧浏览器缺失的API,如html5shiv让IE识别HTML5标签,而转译(如Babel)则是将ES6+语法转换为ES5;3.两者区别在于polyfill解决运行时API缺失,转译解决语法兼容性,现代开发常结合使用Babel和core-js;4.使用polyfill可能带来性能问题,包括文件体积、执行开销和内存占用,可通过按需加载、CDN加速、缓存、压缩和延迟
-
<marquee>在现代浏览器中失效,因HTML5不支持、广告插件主动删除、Chrome120+/Firefox125+默认禁用渲染;应改用CSS@keyframes+transform:translateX()实现滚动,并注意命名、时长、性能及容器样式等细节。
-
行内样式破坏CSS机制导致维护灾难:脱离作用域/继承/层叠/复用,无法响应媒体查询或@layer,硬编码色值和重复样式难以归类抽象,动态内联更引发逻辑耦合与调试困难。
-
不是必须但强烈建议显式声明background-color;因渐变透明或旧版Safari渲染异常,需设安全底色(如起始色),完全透明时须明确写transparent。
-
使用flex-wrap和gap可创建响应式按钮组:通过display:flex、flex-wrap:wrap实现换行,gap统一间距,无需媒体查询即可在不同屏幕下自动调整布局。
-
text-emphasis属性通过添加强调标记为文本提供非侵入性视觉提示。1.它由text-emphasis-style和text-emphasis-color组成,支持dot、circle等样式或自定义字符;2.适用于数据校验、术语标注、内容审核等场景,不干扰文本原有样式;3.浏览器兼容性较好,现代浏览器普遍支持,IE需降级处理;4.存在西文排版冲突、样式灵活性不足及可访问性限制,需结合line-height调整、伪元素或语义化HTML应对。
-
ITCSS六层顺序不可调换,因决定CSS加载与权重优先级:settings/tools最前(变量/函数),generic次之(全局重置),objects/components居中(布局/组件),trumps垫底(工具类);@import或@use必须严格按层归类导入,objects与components需分离结构与视觉职责,trumps禁用语义名且仅含单一行为样式。
-
事件委托通过在父元素绑定单个监听器替代为大量子元素分别绑定,显著减少内存占用;它依赖事件冒泡和closest()精准定位目标元素,适用于动态列表等场景,但不适用于少量静态元素或需精细控制监听器生命周期的情况。
-
自定义HTML滚动条样式主要通过CSS的::-webkit-scrollbar系列伪元素实现,适用于Chrome、Edge、Safari等Webkit内核浏览器。1.使用::-webkit-scrollbar设置滚动条整体宽高,::-webkit-scrollbar-track定义轨道样式,::-webkit-scrollbar-thumb设置滑块外观,配合:hover状态提升交互体验,::-webkit-scrollbar-corner调整角落样式;2.可将伪元素限定于特定容器(如.custom-con
-
正确设置z-index需提前定义层级,因z-index不可动画。定位元素通过高z-index确保层叠优先,避免被遮挡,结合transform和opacity实现流畅动画效果。
-
通过调整CSS动画关键帧,将@keyframes定义为单向线性位移(0%→100%),配合animation:slide9slinearinfinite,即可让元素持续向下移动并在触底后无缝回到顶部,避免反弹效果。
-
完全可行且推荐,Grid负责整体区域划分,Flexbox处理区域内子元素对齐与排列,二者职责分明、协同高效。
-
HTML5原生不支持RTSP,浏览器video标签无法解析rtsp://地址;实际播放依赖服务端转流(如FLV/HLS/WebRTC)或JS库(flv.js/mpegts.js),抓包看到的是HTTP/WS/DTLS等协议而非RTSP。
-
使用clearfix或clear:both可解决浮动导致的父容器高度塌陷。1.在浮动元素后添加clear:both的空元素,强制布局闭合;2.推荐使用clearfix伪类方案,通过.clearfix::after{content:"";display:table;clear:both;}无需额外DOM节点;3.现代开发建议采用overflow:hidden触发BFC或直接使用flex/grid布局,避免浮动问题,提升结构清晰度与维护性。
-
隐藏滚动条但保持滚动功能需用CSS伪元素或属性分别适配浏览器:Chrome/Safari用::-webkit-scrollbar{display:none},Firefox及新版Safari用scrollbar-width:none,同时确保容器有高度和overflow:auto/scroll。