前端技术文章

  • CSSGrid底部按钮居中对齐技巧
    CSSGrid底部按钮居中对齐技巧
    底部按钮居中应由其容器自身控制。1.justify-items:center仅在按钮分处独立网格单元时有效;2.若按钮同属一个区域,需用.buttons{display:flex;justify-content:center}或grid容器的justify-content实现;3.推荐将按钮组放入独立flex或grid容器,避免依赖父级对齐属性,结构更清晰且兼容性好。
    文章 · 前端   |  6个月前  |   底部按钮 CSS Grid 475浏览 收藏
  • HTML表单显示密码强度提示方法
    HTML表单显示密码强度提示方法
    必须用JavaScript监听input事件配合正则与字符集检测实现分级提示,纯pattern无法动态反馈;提示需紧贴input下方用display:none控制显隐,前后端校验策略须一致且可配置。
    文章 · 前端   |  6个月前  |   475浏览 收藏
  • JavaScript解构赋值怎么用
    JavaScript解构赋值怎么用
    JavaScript解构赋值是从数组或对象中按结构提取值并赋给变量的语法糖,不改变原对象、非深拷贝;需注意属性名匹配、重命名、默认值、嵌套安全及源数据可靠性。
    文章 · 前端   |  6个月前  |   475浏览 收藏
  • Svelte 封装可订阅 i18n 翻译函数方法
    Svelte 封装可订阅 i18n 翻译函数方法
    本文介绍如何基于svelte-i18n的format可读存储(readablestore),通过derived创建自定义翻译函数,使其既保留$解包语法,又支持模块化、链式调用的相对路径键名(如$('.value')),同时确保响应式更新。
    文章 · 前端   |  6个月前  |   475浏览 收藏
  • CSS Grid子元素尺寸不一致怎么调?用grid-template-rows和columns调整
    CSS Grid子元素尺寸不一致怎么调?用grid-template-rows和columns调整
    Grid子元素尺寸不一致是默认行为,需通过grid-template-rows/columns明确轨道尺寸、控制子项内部溢出、统一align-items/justify-items对齐方式,并设置grid-auto-rows/columns规范隐式轨道。
    文章 · 前端   |  6个月前  |   475浏览 收藏
  • 风扇噪音大怎么解决?散热与性能平衡技巧
    风扇噪音大怎么解决?散热与性能平衡技巧
    HTML本身无“函数运行时”,风扇噪音大实为浏览器渲染或JS执行致CPU/GPU高负载;频繁innerHTML操作、强制同步布局、非合成层动画等均会触发重排重绘。
    文章 · 前端   |  6个月前  |   475浏览 收藏
  • CSS美化复选框与单选按钮教程
    CSS美化复选框与单选按钮教程
    答案:通过隐藏原生复选框和单选按钮,使用CSS伪元素绘制自定义样式,结合:checked、hover和focus状态提升视觉一致性与交互体验,实现现代美观且可访问的表单控件。
    文章 · 前端   |  7个月前  |   475浏览 收藏
  • CSS网格布局创建带导航栏的页面教程
    CSS网格布局创建带导航栏的页面教程
    Grid头部高度失控主因是未设grid-template-rows或误用auto;应设为60px1fr或clamp(48px,5vh,60px),并确保无额外padding/margin;导航铺不满需设header为grid容器并配grid-template-columns;点击失效多因a标签未设display:block或position:absolute脱离网格流;IE11需加-ms-grid前缀回退。
    文章 · 前端   |  7个月前  |   475浏览 收藏
  • PostCSS合并媒体查询优化CSS代码方法
    PostCSS合并媒体查询优化CSS代码方法
    只有postcss-combine-media-query能真正合并完全相同的媒体查询,需显式引入并置于postcss-nested等插件之后,确保输入CSS已展平;开发环境不建议启用,仅用于生产构建。
    文章 · 前端   |  7个月前  |   475浏览 收藏
  • HTML布局技巧与CSS实战教程
    HTML布局技巧与CSS实战教程
    HTML页面排版应以CSS盒模型、文档流和布局上下文为核心,优先使用Flex和Grid实现可预测、可维护的响应式布局,避免滥用<center>、<br>、float、absolute等易导致塌陷与难维护的旧方法。
    文章 · 前端   |  7个月前  |   475浏览 收藏
  • ServiceWorker拦截请求实现离线加载方法
    ServiceWorker拦截请求实现离线加载方法
    ServiceWorker是实现Web离线能力的核心,需在HTTPS下注册,通过install预缓存、fetch拦截(导航cache-first、APInetwork-first)、activate清理旧缓存,并注意调试与容错。
    文章 · 前端   |  7个月前  |   475浏览 收藏
  • CSS动画结束事件监听方法
    CSS动画结束事件监听方法
    CSS动画可通过原生animationend事件监听结束时机,支持现代浏览器,触发时提供animationName、elapsedTime等属性,需注意infinite动画不触发及内存泄漏问题。
    文章 · 前端   |  7个月前  |   475浏览 收藏
  • Vue递归数据性能优化技巧分享
    Vue递归数据性能优化技巧分享
    Vue.js的computed处理深层嵌套数据时易因过度依赖追踪导致性能下降,应避免全树响应式依赖、使用路径级监听、memoize递归结果、拆分静态结构与动态状态、必要时改用watch按需更新。
    文章 · 前端   |  7个月前  |   475浏览 收藏
  • CSSGrid三列响应式卡片布局教程
    CSSGrid三列响应式卡片布局教程
    用display:grid实现三列自适应卡片的正确方式是:移动端默认单列(1fr),中屏(≥768px)两列(repeat(2,1fr)),桌面端(≥1024px)三列(repeat(3,1fr)),统一用gap控制间距,推荐使用repeat(auto-fit,minmax(300px,1fr)))应对内容不均,并通过align-items:stretch或grid-auto-rows与flex布局结合解决高度不一致问题;IE11需用@supports降级为flex-wrap方案。
    文章 · 前端   |  7个月前  |   475浏览 收藏
  • CSS复杂卡片网格布局教程
    CSS复杂卡片网格布局教程
    实现复杂卡片Grid布局,核心是合理使用CSSGrid的网格划分、区域命名和响应式控制。不需要JavaScript,仅靠CSS就能创建视觉丰富且自适应的布局。定义基本Grid容器使用display:grid启用网格布局,并通过grid-template-columns和grid-template-rows划分行列。配合gap设置卡片间距。示例:.card-grid{display:grid;grid-template-columns:rep
    文章 · 前端   |  7个月前  |   475浏览 收藏
查看更多
课程推荐
  • 前端进阶之JavaScript设计模式
    前端进阶之JavaScript设计模式
    设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
    543次学习
  • GO语言核心编程课程
    GO语言核心编程课程
    本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
    516次学习
  • 简单聊聊mysql8与网络通信
    简单聊聊mysql8与网络通信
    如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
    500次学习
  • JavaScript正则表达式基础与实战
    JavaScript正则表达式基础与实战
    在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
    487次学习
  • 从零制作响应式网站—Grid布局
    从零制作响应式网站—Grid布局
    本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
    485次学习
  • Golang深入理解GPM模型
    Golang深入理解GPM模型
    Golang深入理解GPM调度器模型及全场景分析,希望您看完这套视频有所收获;包括调度器的由来和分析、GMP模型简介、以及11个场景总结。
    474次学习
查看更多
AI推荐
  • PubMedQA数据集详解:生物医学问答基准、功能与应用指南
    PubMedQA
    深入了解PubMedQA生物医学问答数据集,涵盖其核心功能、使用方法及在临床决策、药物研发等场景的应用,助力提升NLP模型性能。
    760次使用
  • H2O EvalGPT:开源LLM大模型评估与排行榜工具
    H2O EvalGPT
    H2O EvalGPT是H2O.ai推出的开源LLM评估平台,提供详细的大模型性能排行榜、行业特定基准测试及A/B测试功能,助您快速选择最适合项目的高性能大语言模型。
    757次使用
  • LMArena是什么?伯克利AI模型评估平台使用指南与功能解析
    LMArena
    LMArena是加州大学伯克利分校推出的AI模型匿名评测平台。通过盲测投票机制,用户可对比不同大模型回答并生成实时排行榜,助力开发者优化模型及用户选择最佳AI工具。
    841次使用
  • 斯坦福HELM:大语言模型Holistic Evaluation整体评估框架详解
    HELM
    深入了解斯坦福推出的HELM(Holistic Evaluation of Language Models)大模型评测体系。本文解析其核心功能、安装配置步骤及应用场景,涵盖准确性、公平性、鲁棒性等多维度指标,助力开发者全面优化语言模型性能。
    807次使用
  • MMBench详解:多模态大模型基准测试、功能特点与使用指南
    MMBench
    MMBench是由上海人工智能实验室等机构联合推出的多模态基准测试平台,提供细粒度能力评估、大规模数据集及VLMEvalKit工具。本文详细介绍其核心功能、安装使用方法及应用场景,助力开发者全面评估多模态模型性能。
    637次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议 和 隐私政策
返回登录
  • 重置密码