前端技术文章
-
- CSS加载优化:压缩与引入策略详解
- 通过构建工具压缩CSS并启用Gzip减少文件体积;2.内联关键CSS、拆分非关键样式以优化加载时机;3.利用media查询和preload按需加载;4.避免@import和深层嵌套以提升解析效率。
- 文章 · 前端 | 6个月前 | 153浏览 收藏
-
- 瀑布流布局实现方法详解
- CSSGrid无法真正实现瀑布流,grid-auto-flow:dense仅回填固定高度空隙,不支持动态列高;真瀑布流需JS计算列高或使用grid-template-rows:masonry(Chrome116+实验性支持),但Safari/Firefox仍不兼容。
- 文章 · 前端 | 6个月前 | 387浏览 收藏
-
- CSS设置Inputplaceholder样式技巧
- Chrome/Firefox/Safari中::placeholder不生效的典型原因是浏览器版本差异导致前缀支持不一:Safari15.4+才稳定支持标准::placeholder,Firefox51+才切换至标准语法但仍需兼容旧版,Chrome/Edge支持::placeholder及::-webkit-input-placeholder;必须同时声明input::placeholder、::-webkit-input-placeholder、::-moz-placeholder、::-ms-inpu
- 文章 · 前端 | 6个月前 | 423浏览 收藏
-
- JavaScript获取当前时间并格式化方法
- 要精确获取年、月、日、时、分、秒等时间组成部分,1.使用newDate()创建时间对象;2.通过getFullYear()获取年份;3.用getMonth()+1获取真实月份(注意0-11);4.getDate()获取日期;5.getHours()获取小时;6.getMinutes()获取分钟;7.getSeconds()获取秒数;为确保格式统一,可用padStart(2,'0')补零,最终拼接成如YYYY-MM-DDHH:mm:ss的格式。
- 文章 · 前端 | 6个月前 | 420浏览 收藏
-
- CSS文字阴影技巧:text-shadow提升视觉对比度
- text-shadow语法为水平偏移、垂直偏移、模糊半径、颜色,顺序不可错;常用于复杂背景提可读性;失效多因overflow裁剪、颜色相近或逗号遗漏;推荐双层阴影组合提升质感。
- 文章 · 前端 | 6个月前 | 403浏览 收藏
-
- HTML模板优化技巧:提升网页加载速度
- 应使用defer属性加载业务JS、async加载统计脚本,禁用document.write;首屏CSS内联且控制在2–3KB,非关键CSS用media="print"延迟加载;图片首屏用eager、非首屏用lazy;启用Gzip/Brotli压缩。
- 文章 · 前端 | 6个月前 | 386浏览 收藏
-
- JS弱引用原理与使用场景解析
- JavaScript需要弱引用以避免内存泄漏,主要通过WeakMap和WeakSet实现;其键或元素为对象时,不阻止垃圾回收,适用于为对象关联元数据、缓存、标记等场景,但无法遍历、不能用原始值作键、值为强引用且回收时机不确定,故仅解决特定内存泄漏问题,非万能工具。
- 文章 · 前端 | 6个月前 | 148浏览 收藏
-
- CSS容器查询+JS状态机,实现自适应布局方案
- 容器查询配合轻量状态机是当前最干净的微观自适应方案,需前置设置container-type、viewportmeta及使用@container语法,再通过ResizeObserver驱动状态机切换CSS类名实现精准响应。
- 文章 · 前端 | 6个月前 | 154浏览 收藏
-
- Flex布局边框网格技巧分享
- 优先用gap替代border实现等距网格,移除item边框改用outline或background+padding模拟;必须用border时,统一box-sizing:border-box并配合精确calc计算flex-basis。
- 文章 · 前端 | 6个月前 | 160浏览 收藏
-
- Sass优化Flexbox:常用对齐属性封装方法
- 应按用途语义化封装@mixin,如flex-row-center,而非通用参数化写法;需避免参数顺序错误、默认值干扰、意图不明确等问题,子项mixin须带-item-后缀,注意IE兼容与编译体积。
- 文章 · 前端 | 6个月前 | 111浏览 收藏
-
- HTML调用数据库数据的实现方式解析
- index.html无法直接连接数据库,必须通过后端服务中转;前端用fetch调用API,后端连接数据库并返回JSON;切勿硬编码数据库凭证,需处理CORS和安全防护。
- 文章 · 前端 | 6个月前 | 478浏览 收藏
-
- CSS响应式图片裁剪问题解决方法
- object-fit是解决响应式图片拉伸/裁剪问题的核心方案,需配合object-position精准控制裁剪锚点,并通过background-image或JS降级兼容IE。
- 文章 · 前端 | 6个月前 | 192浏览 收藏
-
- Less混合功能如何简化代码与构建响应式函数
- 直接写.responsive-font()会编译失败,因为定义时若漏掉括号(如.responsive-font{...})则不被视为Mixin,调用时.responsive-font()就报undefined;且调用必须带括号,参数类型须匹配,默认值确保空参可编译。
- 文章 · 前端 | 6个月前 | 360浏览 收藏
-
- CSSfixed遮挡锚点,scroll-padding-top解决方法
- fixed导航栏遮挡锚点内容是因浏览器将目标元素顶部对齐视口顶部,而scroll-padding-top(设于html)可精准偏移滚动终点,仅影响滚动逻辑不破坏布局,Chrome89+/Firefox90+/Safari15.4+原生支持。
- 文章 · 前端 | 6个月前 | 368浏览 收藏
-
- 隐藏元素的多种技巧与渲染影响
- display:none是唯一真正移除渲染的方式,元素从渲染树中完全剔除、不占空间、不响应事件、JS查询尺寸为0,适合权限控制和条件渲染,但频繁切换会触发重排。
- 文章 · 前端 | 6个月前 | 462浏览 收藏
查看更多
课程推荐
-
- 前端进阶之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推荐
-
- PubMedQA
- 深入了解PubMedQA生物医学问答数据集,涵盖其核心功能、使用方法及在临床决策、药物研发等场景的应用,助力提升NLP模型性能。
- 1006次使用
-
- H2O EvalGPT
- H2O EvalGPT是H2O.ai推出的开源LLM评估平台,提供详细的大模型性能排行榜、行业特定基准测试及A/B测试功能,助您快速选择最适合项目的高性能大语言模型。
- 1011次使用
-
- LMArena
- LMArena是加州大学伯克利分校推出的AI模型匿名评测平台。通过盲测投票机制,用户可对比不同大模型回答并生成实时排行榜,助力开发者优化模型及用户选择最佳AI工具。
- 1132次使用
-
- HELM
- 深入了解斯坦福推出的HELM(Holistic Evaluation of Language Models)大模型评测体系。本文解析其核心功能、安装配置步骤及应用场景,涵盖准确性、公平性、鲁棒性等多维度指标,助力开发者全面优化语言模型性能。
- 1106次使用
-
- MMBench
- MMBench是由上海人工智能实验室等机构联合推出的多模态基准测试平台,提供细粒度能力评估、大规模数据集及VLMEvalKit工具。本文详细介绍其核心功能、安装使用方法及应用场景,助力开发者全面评估多模态模型性能。
- 952次使用

