-
- 视频自动播放与暂停功能实现教程
- 用IntersectionObserver实现视频自动播放与离开暂停，需监听视口交集、设置静音autoplay、防抖处理状态、兼容降级。核心是isIntersecting为true时try-catch调用play()（确保muted），false时pause()；不支持时回退scroll+getBoundingClientRect模拟。
- 文章 · 前端 | 21小时前 | 112浏览 收藏
-
- overflow:hidden与auto区别详解
- overflow:hidden直接裁剪溢出内容且不提供滚动，适用于明确设计意图的截断场景；overflow:auto仅在内容溢出时显示滚动条，更克制，适合内容长度不确定的区域。
- 文章 · 前端 | 18小时前 | 111浏览 收藏
-
- CSS变量打造统一阴影层级方案
- z-index可用CSS变量但仅限静态数值，因不支持表达式或单位；需配合position才生效，且变量不创建层叠上下文；推荐分层定义基础值并避免嵌套calc。
- 文章 · 前端 | 2小时前 | 108浏览 收藏
-
- getAttribute和setAttribute使用详解
- 应区分HTML属性与DOM属性：getAttribute/setAttribute操作HTML属性（如data-、disabled字符串值），而value、checked等状态属性应直接读写DOM属性，class/style/data-推荐用classList/dataset/style.cssText。
- 文章 · 前端 | 2天前 | 107浏览 收藏
-
- HTML语义化评论区域结构详解
- 原生HTML规范中不存在专门表示“评论区域”的语义化标签，<comment>是无效标签；应使用<section>包裹评论区，每条评论用独立<article>，回复用<aside>，避免深度嵌套。
- 文章 · 前端 | 2天前 | 107浏览 收藏
-
- HTML通知对消息推送影响大吗？避坑指南
- HTML通知仅为前端展示层，真后台推送需ServiceWorker+WebPushAPI；NotificationAPI仅支持页面开启时的桌面通知，iOSSafari完全不支持；WebPush需HTTPS、用户授权、后端VAPID推送服务配合。
- 文章 · 前端 | 12小时前 | 107浏览 收藏
-
- 新版浏览器对HTML5游戏影响解析
- 新版Chrome/Edge限制file://协议跨文件加载，需用HTTP服务（如LiveServer）运行；音视频问题需启用硬件加速及解码器；Canvas/WebGL异常应检查GPU加速与扩展冲突；fetch等API需安全上下文，建议本地开发使用localhost。
- 文章 · 前端 | 18小时前 | 106浏览 收藏
-
- HTML音乐列表与音频播放器实现方法
- 用单个隐藏<audio>实例配合JS动态切换src实现轻量音乐列表，列表项绑定data-src属性，点击时暂停当前、更新源并播放，注意iOS用户手势触发、Promise错误捕获及跨域配置。
- 文章 · 前端 | 15小时前 | 106浏览 收藏
-
- HTML语音识别实现方法【WebSpeechAPI教程】
- SpeechRecognition通过JavaScript调用WebSpeechAPI实现，需兼容性检测并用用户手势启动；interimresults和continuous决定识别模式；lang必须设为'zh-CN'且在start()前配置。
- 文章 · 前端 | 2天前 | 104浏览 收藏
-
- CSSbox-shadow打造立体阴影效果
- box-shadow参数顺序为水平偏移、垂直偏移、模糊半径、扩散半径（可选）、颜色；多层需逗号分隔于同一声明；伪元素承载更稳妥；推荐rgba()控透明度。
- 文章 · 前端 | 2天前 | 104浏览 收藏
-
- CSSFlex垂直居中布局技巧
- 加了align-items:center没反应是因为父容器未设display:flex且缺乏明确高度（如min-height:100vh），Bootstrap栅格默认非flex容器，需显式添加d-flex等工具类并确保高度上下文有效。
- 文章 · 前端 | 2天前 | 104浏览 收藏
-
- 修改Bootstrap输入框阴影颜色，自定义box-shadow样式
- Bootstrap5表单输入框:focus时默认有两层box-shadow：0000.25remrgba(13,110,253,0.25)和0000.25remtransparent，用于实现聚焦发光效果并补偿border-width。
- 文章 · 前端 | 17小时前 | 104浏览 收藏
-
- HTML自定义元素生命周期详解
- CustomElement生命周期回调由浏览器在DOM变化时自动触发，connectedCallback仅在元素首次插入activeDOM树时执行；attributeChangedCallback需通过observedAttributes显式声明监听属性；disconnectedCallback是清理资源的主要时机但不保证总被调用；constructor仅限轻量初始化，不可操作DOM，且必须继承HTMLElement并首行调super()。
- 文章 · 前端 | 2小时前 | 102浏览 收藏
-
- CSS粘性导航栏实现方法详解
- position:sticky导航栏纹丝不动，最常见原因是未设top等偏移值、父容器overflow非visible、高度未定义或存在transform等触发层叠上下文的属性。
- 文章 · 前端 | 13小时前 | 101浏览 收藏
-
- PerformanceObserver优化FID提升交互体验
- 必须监听"first-input"类型，因为只有它能准确提供首个用户输入事件的startTime与processingStart之差即FID值；监听"event"无法识别首次输入且无处理延迟数据，"navigation"则完全无关。
- 文章 · 前端 | 18小时前 | 100浏览 收藏
查看更多
课程推荐
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案，代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景，打造一站式知识长龙服务，适合有JS基础的同学学习。
- 543次学习
-
- GO语言核心编程课程
- 本课程采用真实案例，全面具体可落地，从理论到实践，一步一步将GO核心编程技术、编程思想、底层实现融会贯通，使学习者贴近时代脉搏，做IT互联网时代的弄潮儿。
- 516次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信：Le-studyg；在课程中，我们将首先介绍MySQL8的新特性，包括性能优化、安全增强、新数据类型等，帮助学生快速熟悉MySQL8的最新功能。接着，我们将深入解析MySQL的网络通信机制，包括协议、连接管理、数据传输等，让
- 500次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网，分为导航，轮播，关于我们，成功案例，服务流程，团队介绍，数据部分，公司动态，底部信息等内容区块。网站整体采用CSSGrid布局，支持响应式，有流畅过渡和展现动画。
- 485次学习
-
- Golang深入理解GPM模型
- Golang深入理解GPM调度器模型及全场景分析，希望您看完这套视频有所收获；包括调度器的由来和分析、GMP模型简介、以及11个场景总结。
- 474次学习
查看更多
AI推荐
-
- ChatExcel酷表
- ChatExcel酷表是由北京大学团队打造的Excel聊天机器人，用自然语言操控表格，简化数据处理，告别繁琐操作，提升工作效率！适用于学生、上班族及政府人员。
- 4392次使用
-
- Any绘本
- 探索Any绘本（anypicturebook.com/zh），一款开源免费的AI绘本创作工具，基于Google Gemini与Flux AI模型，让您轻松创作个性化绘本。适用于家庭、教育、创作等多种场景，零门槛，高自由度，技术透明，本地可控。
- 4743次使用
-
- 可赞AI
- 可赞AI，AI驱动的办公可视化智能工具，助您轻松实现文本与可视化元素高效转化。无论是智能文档生成、多格式文本解析，还是一键生成专业图表、脑图、知识卡片，可赞AI都能让信息处理更清晰高效。覆盖数据汇报、会议纪要、内容营销等全场景，大幅提升办公效率，降低专业门槛，是您提升工作效率的得力助手。
- 4621次使用
-
- 星月写作
- 星月写作是国内首款聚焦中文网络小说创作的AI辅助工具，解决网文作者从构思到变现的全流程痛点。AI扫榜、专属模板、全链路适配，助力新人快速上手，资深作者效率倍增。
- 6398次使用
-
- MagicLight
- MagicLight.ai是全球首款叙事驱动型AI动画视频创作平台，专注于解决从故事想法到完整动画的全流程痛点。它通过自研AI模型，保障角色、风格、场景高度一致性，让零动画经验者也能高效产出专业级叙事内容。广泛适用于独立创作者、动画工作室、教育机构及企业营销，助您轻松实现创意落地与商业化。
- 4998次使用
