前端技术文章

  • css盒模型限制内容宽度但需保持灵活怎么办_css限制问题用max-width与padding组合
    css盒模型限制内容宽度但需保持灵活怎么办_css限制问题用max-width与padding组合
    使用max-width结合padding和box-sizing可有效控制布局宽度与灵活性,.container设置max-width限制最大宽度,配合padding确保内边距舒适性,box-sizing:border-box防止尺寸溢出,实现响应式自适应布局。
    文章 · 前端   |  2个月前  |   317浏览 收藏
  • 闭包实现热更安全注入模块
    闭包实现热更安全注入模块
    闭包是热更新中维持状态的关键载体,需通过debug.upvaluejoin保留Upvalue、沙盒隔离加载、钩子注入策略、静态检查与运行时控制四层机制保障安全热更。
    文章 · 前端   |  2个月前  |   317浏览 收藏
  • CSS过渡与动画怎么用?transition和keyframes技巧
    CSS过渡与动画怎么用?transition和keyframes技巧
    transition和@keyframes不能混用同一属性,否则会导致卡顿、跳变或keyframes不触发;二者机制独立,animation优先级更高但易冲突;应按职责分离:transition处理简单交互反馈,@keyframes处理多阶段复杂动画,并避免动态修改被占用的属性。
    文章 · 前端   |  2个月前  |   317浏览 收藏
  • HTML语义标签:Header、Main、Footer规范解析
    HTML语义标签:Header、Main、Footer规范解析
    header必须为body或语义容器的直接子元素,main只能出现一次且为body直系子元素,footer表示结尾信息不可滥用;三者嵌套错误会破坏可访问性、SEO及HTML5大纲。
    文章 · 前端   |  2个月前  |   317浏览 收藏
  • HTML模块加载方法与4种import优化技巧
    HTML模块加载方法与4种import优化技巧
    现代Web开发倾向于使用ESM而非传统脚本,原因包括:1.作用域隔离,避免全局变量污染;2.明确的依赖管理,自动解析模块顺序;3.默认异步加载,提升页面性能;4.支持严格模式和CORS;5.支持TreeShaking优化代码体积。
    文章 · 前端   |  2个月前  |   317浏览 收藏
  • 无限滚动加载实现方法详解
    无限滚动加载实现方法详解
    用IntersectionObserver实现无限滚动的核心是观察占位元素是否进入视口,而非监听window.onscroll;需设rootMargin提前触发、每次加载后重新observe、校验响应结构、防重复请求与XSS、降级处理兼容性问题。
    文章 · 前端   |  2个月前  |   317浏览 收藏
  • CommonJS与ES模块对比分析
    CommonJS与ES模块对比分析
    CommonJS采用同步加载和值拷贝,模块导出的是静态值;ES模块支持异步加载和动态引用,导出绑定保持实时更新,两者在加载机制、缓存策略及变量绑定上存在本质差异。
    文章 · 前端   |  2个月前  |   CommonJS ES模块 317浏览 收藏
  • HTML5视频循环播放方法详解
    HTML5视频循环播放方法详解
    可通过loop属性、ended事件监听、setAttribute动态控制或muted+autoplay组合实现HTML5音视频自动循环;loop最简捷,ended事件更可控,动态切换适合交互场景,静音autoplayloop则保障自动播放兼容性。
    文章 · 前端   |  2个月前  |   317浏览 收藏
  • Flex布局怎么设置元素位置
    Flex布局怎么设置元素位置
    Flex容器默认按主轴方向排列子元素,由flex-direction决定,默认row;2.justify-content、align-items和gap控制间距,可实现居中等布局;3.position:relative不脱离Flex流,可通过偏移调整位置,保留原有空间;4.position:absolute使元素脱离布局流,不参与排列,相对定位祖先定位,不影响其他项;5.微调用margin或transform,覆盖需求用absolute并确保父级定位。
    文章 · 前端   |  2个月前  |   317浏览 收藏
  • defer属性使用方法详解
    defer属性使用方法详解
    defer属性仅对外部脚本(含src属性)生效,执行于DOM构建完成之后、DOMContentLoaded事件触发之前,且按HTML顺序依次执行。
    文章 · 前端   |  1个月前  |   316浏览 收藏
  • 守卫动态面包屑实现路径追踪教程
    守卫动态面包屑实现路径追踪教程
    to.matched数组是实现动态面包屑的首选方式,因其天然反映路由嵌套层级、支持刷新和直接访问、可配合meta过滤与权限控制,并能处理参数化路由和动态标题。
    文章 · 前端   |  1个月前  |   316浏览 收藏
  • 嵌套路由如何重定向到首子页?解决空白问题
    嵌套路由如何重定向到首子页?解决空白问题
    访问父路由页面空白是因为未配置默认子路由,应在children中添加path:''的子路由并redirect至首个子页面,如{path:'',redirect:'overview'},同时确保父组件含<router-view>。
    文章 · 前端   |  1个月前  |   316浏览 收藏
  • Less中quoted与unquoted转换属性值为字符串的方法
    Less中quoted与unquoted转换属性值为字符串的方法
    quoted()和unquoted()仅作用于字符串字面量,不支持运行时计算结果;动态拼接应优先使用插值(@{...}),真正字符串操作需依赖Less4.0+的JS函数。
    文章 · 前端   |  1个月前  |   316浏览 收藏
  • CSS单侧边框设置方法详解
    CSS单侧边框设置方法详解
    border-left没生效主要因三点:未设border-style、父容器overflow:hidden裁剪或元素为inline需改display;Retina屏模糊需用0.5px或transform缩放;flex中推荐gap+border-right替代以避免宽度计算错误。
    文章 · 前端   |  1个月前  |   316浏览 收藏
  • CSS悬浮提示文本实现方法
    CSS悬浮提示文本实现方法
    答案:纯CSS可实现悬浮提示文本功能,通过:hover伪类和::after伪元素生成提示框。首先设置元素相对定位,利用data-tooltip属性存储提示内容,伪元素通过content:attr()获取文本,初始隐藏(visibility:hidden,opacity:0),悬停时显示(visibility:visible,opacity:1),并添加过渡动画。可扩展三角箭头、多方向定位、换行控制等优化。关键在于定位与显隐控制逻辑。
    文章 · 前端   |  1个月前  |   CSS 悬浮提示 316浏览 收藏
查看更多
课程推荐
  • 前端进阶之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推荐
  • ljg-skills -
    ljg-skills
    ljg-skills 是李继刚开源的 AI 技能与提示词集合,面向大模型使用者整理了一批可复用的 prompt、角色设定和任务技能模板,适合用于学习提示词设计、搭建个人 AI 工作流和沉淀团队常用智能体能力。
    4495次使用
  • MELO音乐 - AI 音乐生成平台,支持多模态创作能力
    MELO音乐
    MELO音乐是一站式AI视频与音乐制作助手,对标suno, udio的高品质体验。提供伴奏生成、原创写词、无损导出、哼唱识曲、混音变声等全套音频与短视频编辑工具。无论是流行Kpop、电音说唱、民谣古风、摇滚儿歌还是商用轻音乐,MELO为你免费谱曲,轻松做同款!
    4175次使用
  • UniScribe - AI 免费在线音视频转文字平台
    UniScribe
    UniScribe 是一款 AI 音视频转文字与内容整理工具,支持上传音频、视频文件或粘贴 YouTube 链接,自动生成转写文本、摘要、思维导图和关键问题,并支持多格式导出,适合会议记录、课程学习、访谈整理和内容创作复盘。
    4144次使用
  • 剧云 - 免费 AI 智能中文剧本创作平台
    剧云
    剧云是专业中文剧本创作平台,安全稳定运行十余年,集成AI编剧、剧本医生审核、人物小传、剧情关系图、大纲编写、多人协作、Word导入导出、版权管控功能,数据安全防护,轻松高效创作剧本。
    4369次使用
  • 万象有声 - AI 一站式有声内容创作平台
    万象有声
    万象有声,一个专为有声创作者打造的新一代智能有声内容创作平台。平台提供专业的智能拆章、智能画本编辑、AI配音、AI生成音效、后期制作、智能对轨、智能审听等有声创作全流程工具,可以帮助创作者高效、低成本创作出引人入胜的有声作品。立即体验,让有声书制作更简单!
    4313次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议隐私政策
返回登录
  • 重置密码