-
屏幕录制无法通过HTML直接实现,必须依赖JavaScript调用WebAPI;2.核心技术是使用MediaDevices.getDisplayMedia()获取屏幕流,再通过MediaRecorder进行录制和保存;3.常见问题包括用户权限拒绝、浏览器兼容性差异、音频捕获限制、性能开销大、文件体积大以及隐私安全风险;4.录制完成后可通过Blob生成下载链接实现客户端保存,或使用FormData结合fetch上传至服务器;5.大文件应采用分块上传策略以提升稳定性,后端可进行存储、转码、元数据提取等处理;6
-
cancelAnimationFrame必须传入requestAnimationFrame返回的有效帧ID才能取消未执行的帧请求,无法中断已进入回调队列的当前帧;动画函数内部须加状态守卫提前return,避免多余操作和内存泄漏。
-
外链的<img>或background-image引入的SVG无法用CSS控制内部<path>颜色,因其被当作位图处理;只有inlineSVG才能通过fill:currentColor或CSS变量动态换色。
-
推荐使用overflow-wrap:break-word解决长单词溢出,它优先保持单词完整,仅在必要时断行;而word-break:break-all会无差别切割,影响可读性。
-
图片不显示的四大原因:路径错误(相对HTML文件)、img标签不规范(未自闭合或缺alt)、CSS隐藏(如overflow:hidden或vertical-align问题)、格式兼容性差(如WebP不支持)。
-
推荐使用sepia(0.6)contrast(1.1)brightness(0.95)组合实现自然老照片效果,避免sepia(1)过重发黑;透明PNG需配合泛黄背景(如#f8f2e9)防止层次丢失;高保真褪色需Canvas或SVG方案,但性能开销大。
-
CSS选择器与动画结合可提升交互体验。通过transition配合后代选择器实现悬停效果,如.card:hover.title改变颜色和位置;使用animation与直接子选择器(>)定义@keyframes滑入动画,结合自定义属性--i设置延迟,实现列表项逐项显示;应避免深层嵌套选择器以提升性能,推荐用transform、opacity和will-change优化渲染,保持结构清晰与控制精准。
-
sanitize.css是现代项目必备基础样式库,它通过:where()保持低特异性、保障表单一致性、默认支持响应式与无障碍,比手动重置或使用reset.css更高效可靠。
-
表单验证必须同时使用addEventListener('input')和submit事件:input实现实时反馈,submit作为防绕过兜底;正则需严格使用^和$锚定边界,并配合trim()处理空格,所有前端校验均不可替代服务端验证。
-
overflow-y:auto在Flex容器中失效,根本原因是父容器无明确高度约束导致无法触发溢出;必须设置height/max-height,并为滚动区域添加min-height:0及-webkit-overflow-scrolling:touch(iOS兼容)。
-
Less中写媒体查询需用&显式绑定父选择器,如.nav{@media(max-width:768px){&{display:none;}}};避免深层嵌套、冗余循环和无效组合,合理拆分文件并使用变量管理断点与移动端样式。
-
HTML是声明式标记语言,只描述结构与语义,不执行逻辑;其核心价值在于通过语义化标签(如<header>、<nav>、<main>)明确内容角色,支撑SEO、无障碍访问与代码可维护性。
-
Chrome和Edge强制将小于12px的font-size提升至12px以保障可访问性,Firefox无此限制但受用户级最小字号设置影响;可通过transform:scale()、SVG文字或图片替代等方法绕过,需注意布局补偿与兼容性。
-
crypto.subtle.importKey导入失败主因是密钥格式、算法名称或usages三者不匹配:密钥须为ArrayBuffer(非PEM/Base64)、算法名须与密钥类型严格对应(如AES-GCM不能用于RSA)、usages必须包含后续实际操作(如encrypt/decrypt)。
-
用CSSGrid实现响应式书架网格的核心是grid-template-columns:repeat(auto-fit,minmax(240px,1fr)),配合gap:1.5rem、卡片内flex-column布局、封面图aspect-ratio:2/3+object-fit:cover、交互仅用transform/opacity避免重排,以及文字用-webkit-line-clamp和clamp()自适应截断。