前端技术文章
-
- CSSgap布局技巧分享
- Flexbox的gap属性直到2021年才被主流浏览器稳定支持，IE完全不支持，旧版Safari存在部分识别但不渲染的问题；gap定义相邻元素间隙，justify-content定义整体对齐关系，二者混用会导致布局失控。
- 文章 · 前端 | 3个月前 | 446浏览 收藏
-
- React状态更新失败原因及解决方法
- 本文深入分析React中因组件生命周期和状态更新机制理解偏差导致的UI不更新问题，重点讲解componentDidMount仅执行一次的特性如何引发“状态已变但视图未更新”的典型陷阱，并提供基于函数组件、useEffect和受控状态的现代解决方案。
- 文章 · 前端 | 3个月前 | 134浏览 收藏
-
- HTML实现网页背景色的定时随机切换，主要依赖于JavaScript来动态修改CSS样式。以下是详细的步骤和代码示例：✅ 实现思路使用 HTML：创建一个基本的网页结构。使用 CSS：可以定义一些基础样式（可选）。使用 JavaScript：生成随机颜色。定时器（setInterval）控制切换频率。修改 document.body.style.backgroundColor 来改变背景色。📄 示
- 用setInterval+HSL随机色相（0–360）配固定饱和度70%、明度85%实现柔和背景切换，间隔3000–8000ms，添加鼠标悬停暂停、卸载前清除定时器，并预设CSStransition确保淡入淡出生效。
- 文章 · 前端 | 3个月前 | 163浏览 收藏
-
- HTML渐变背景CSS实现方法详解
- 最直接的写法是用background-image:linear-gradient()给body或容器设渐变背景；需配background-color降级，避免用background简写覆盖，并注意浏览器兼容性与移动端渲染问题。
- 文章 · 前端 | 3个月前 | 260浏览 收藏
-
- CSSGrid页头布局实战技巧
- CSSGrid实现复杂页头需在header容器设display:grid和grid-template-areas（带引号多行声明），子元素grid-area值须严格匹配；响应式需重写entireareas；吸顶用position:sticky于子行而非整个header；box-sizing:border-box必须统一。
- 文章 · 前端 | 3个月前 | 425浏览 收藏
-
- HTML表单如何追踪用户视线？
- HTML表单无法直接获取视线轨迹，需用mousemove、focus/blur、scroll等代理信号推测注意力；应避免误用IntersectionObserver，聚焦字段级行为链聚合与合理埋点。
- 文章 · 前端 | 3个月前 | 224浏览 收藏
-
- HTML如何实现二维码扫描｜前端扫码方法详解
- HTML无法直接扫码，需用JavaScript调用摄像头：通过navigator.mediaDevices.getUserMedia获取视频流，用jsQR等库逐帧解码二维码；须控制帧率、适配分辨率、及时关闭媒体轨道，并确保HTTPS环境与权限处理。
- 文章 · 前端 | 3个月前 | 188浏览 收藏
-
- CSS自动填充网格布局技巧
- auto-fit只创建有内容的轨道并拉伸填满容器，auto-fill则无论内容多少都按minmax()尽可能预留全部轨道，导致空列和布局错位。
- 文章 · 前端 | 3个月前 | 242浏览 收藏
-
- 相对路径引用CSS文件的正确写法与注意事项
- 正确引用外部CSS需根据HTML与CSS文件的相对位置使用路径。同一目录用href="style.css"，子目录用href="css/style.css"，上级目录用href="../style.css"，多级跳转如href="../../assets/css/main.css"；注意大小写敏感、使用正斜杠/、避免以/开头导致根路径误用，并通过开发者工具Network面板验证加载情况。
- 文章 · 前端 | 3个月前 | 377浏览 收藏
-
- HTML中的manifest.json文件主要用于定义PWA（渐进式网页应用）的元信息，如应用名称、图标、启动URL等。不过，manifest.json本身并不支持直接配置“快捷方式”（shortcuts），这是浏览器对PWA的一种扩展功能，需要结合其他技术实现。但如果你是指如何在PWA中添加应用快捷方式入口（即用户点击桌面或开始菜单时能直接启动应用的快捷方式），那么你需要使用 Web App M
- shortcuts字段必须是顶层非空数组，每项须含name和url（相对路径），且url需符合scope范围；Android要求显式配置icons，否则显示空白。
- 文章 · 前端 | 3个月前 | 288浏览 收藏
-
- CSS全屏切换效果：vh与vw构建幻灯片
- 根本原因是移动端浏览器地址栏收放导致vh动态变化，应改用min-height:100vh+height:100%、JS同步--vh变量、监听resize/orientationchange事件并防抖处理，确保全屏体验稳定。
- 文章 · 前端 | 3个月前 | 133浏览 收藏
-
- JIT编译器热点优化与去优化解析
- JIT优化不是“一劳永逸”因为其依赖的运行时推测信息可能失效，一旦假设被违反（如类型变化、类加载、虚方法目标变更等），必须执行去优化（deoptimization）回退到解释执行。
- 文章 · 前端 | 3个月前 | 226浏览 收藏
-
- CSS移动端字体闪烁解决方法
- font-display:swap需配合preload、font-size-adjust和min-height容器兜底才能缓解移动端CLS，单独使用反而加剧布局跳动。
- 文章 · 前端 | 3个月前 | 476浏览 收藏
-
- CSS不规则格子布局实现方法
- 优先用grid-column和grid-row手动控制每个格子的起止线；grid-template-areas仅适用于语义固定、命名稳定的布局场景。
- 文章 · 前端 | 3个月前 | 182浏览 收藏
-
- HTML画中画标题设置与API详解
- 画中画标题样式受限，只能通过video::picture-in-picture-title伪类调整color和font-family等极少数属性；1.浏览器限制样式是为了安全，防止伪造系统界面进行钓鱼等恶意行为；2.保持用户体验一致性，确保PiP窗口在不同网站间外观统一、易于识别和操作；3.技术上因PiP窗口由浏览器原生UI层渲染，网页CSS控制能力本就有限；4.标题内容应通过<video>标签的title属性设置，以确保清晰传达视频信息；5.优化PiP体验可从提升视频质量、优化title文案
- 文章 · 前端 | 3个月前 | 289浏览 收藏
查看更多
课程推荐
-
- 前端进阶之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推荐
-
- SuperCLUE
- SuperCLUE是权威的中文大语言模型综合评测基准，涵盖语言理解、知识应用、AI Agent智能体及安全性等12项核心能力。通过多轮对话与客观测试，定期发布榜单与技术报告，为模型研发、优化及行业选型提供科学依据。
- 117次使用
-
- C-Eval
- 深入了解C-Eval中文评估套件，涵盖52个学科与4级难度。本文详解其功能特点、Zero-shot/Few-shot使用方法及代码示例，助您全面评测LLM中文理解与泛化能力。
- 38次使用
-
- Gradio
- Gradio是一个用于构建机器学习和数据科学Web应用的开源Python库。支持快速创建交互界面，获Google、Meta等大厂青睐，适合模型演示、部署反馈及调试。
- 114次使用
-
- AutoGPT
- AutoGPT是基于GPT-4的开源AI代理平台，拥有超10万GitHub星标。本文介绍其低代码界面、自动化工作流功能、系统配置要求及安装步骤，助您高效部署和管理AI Agent。
- 118次使用
-
- Dataify
- Dataify是专注AI生态的一站式数据服务平台，整合全球住宅代理、多源数据采集API及高质量训练数据集。支持LLM训练、跨境电商及金融分析，解决数据孤岛难题，助力企业智能化转型。
- 26次使用
