前端技术文章

  • 私有方法封装提升代码安全与维护性
    私有方法封装提升代码安全与维护性
    类私有方法是保护内部复杂业务状态更新逻辑最直接有效的手段,通过封装校验、转换、依赖协调等环节,明确职责边界、阻止非法调用、配合私有属性构建防护闭环,并为重构提供安全空间。
    文章 · 前端   |  1个月前  |   479浏览 收藏
  • HTMLSanitizerAPI防止XSS方法详解
    HTMLSanitizerAPI防止XSS方法详解
    应使用setHTML()配合Sanitizer实例替代innerHTML,因其默认禁用事件处理器、javascript:伪协议等XSS载荷;但需注意浏览器兼容性(Safari不支持)、必须显式传入Sanitizer实例、不支持ShadowDOM,且服务端仍需基础过滤。
    文章 · 前端   |  1个月前  |   479浏览 收藏
  • CSS中使用rgb()设置动态颜色的方法
    CSS中使用rgb()设置动态颜色的方法
    利用rgb()函数结合CSS变量和JavaScript可实现网页颜色的动态调整。首先通过CSS定义红、绿、蓝三个颜色分量的自定义属性,并在元素中使用var()引用这些变量;然后通过JavaScript修改这些变量值,实现全局颜色实时变化。相比hex和hsl(),rgb()更适用于需要直接操作颜色通道的场景,尤其适合数据驱动的颜色控制。在实际项目中,可通过颜色输入框获取用户选择的颜色值,将其转换为RGB分量并更新CSS变量,从而实现主题切换。为提升可读性,还可根据颜色亮度自动调整文本与背景色对比度。对于动画
    文章 · 前端   |  1个月前  |   CSS教程 css函数怎么用 479浏览 收藏
  • CSS颜色名称与代码对照表
    CSS颜色名称与代码对照表
    CSS颜色名称与十六进制、RGB值一一对应,如red为#FF0000或rgb(255,0,0),共支持140多种标准色,可通过W3C规范或开发者工具查询,推荐使用十六进制以保证兼容性,RGB适用于透明度控制,HSL便于调整色彩属性。
    文章 · 前端   |  1个月前  |   479浏览 收藏
  • 响应式悬浮按钮实现方法
    响应式悬浮按钮实现方法
    fixed定位按钮错位因未适配安全区域和键盘遮挡,应使用inset、env(safe-area-inset-bottom)、visualViewportAPI及JS检测键盘弹出。
    文章 · 前端   |  2个月前  |   479浏览 收藏
  • HTMLmeta标签优化与移动端适配技巧
    HTMLmeta标签优化与移动端适配技巧
    页面在手机上缩成一团的头号原因是viewportmeta标签缺失或参数错误,必须设置width=device-width、initial-scale=1.0,且置于head最前;否则浏览器按980px渲染后缩放,导致文字过小、点击错位。
    文章 · 前端   |  2个月前  |   479浏览 收藏
  • JavaScript图表制作教程与技巧
    JavaScript图表制作教程与技巧
    答案是使用JavaScript库如Chart.js、D3.js和ECharts可实现交互式数据可视化;其中Chart.js适合快速集成常见图表,D3.js适用于高度自定义的复杂图形,ECharts支持高级图表且中文文档完善;以Chart.js创建柱状图需引入库、添加canvas容器并初始化Chart对象;通过事件监听、动态数据更新和实时刷新增强交互性;结合响应式布局与性能优化确保跨设备流畅展示。
    文章 · 前端   |  2个月前  |   479浏览 收藏
  • 表格外边框样式设置方法
    表格外边框样式设置方法
    frame属性仅控制table外边框的显示边(如void隐藏、hsides显上下),不控制样式/颜色/粗细,与CSSborder无关且不影响内部分割线。
    文章 · 前端   |  2个月前  |   HTML常见属性及用途 479浏览 收藏
  • CSSNano优化:精简样式表体积技巧
    CSSNano优化:精简样式表体积技巧
    CSSNano压缩后样式失效主因是默认激进规则误删/改写关键代码,需禁用mergeRules、sortSelectors等选项,确保其作为PostCSS插件正确配置在postcss-loader中且顺序合理。
    文章 · 前端   |  2个月前  |   479浏览 收藏
  • CSS变量var实现全局主题切换教程
    CSS变量var实现全局主题切换教程
    CSS变量需用var(--name)配合:root定义,支持作用域覆盖、fallback链和JS动态修改,但不兼容IE,且不能用于@keyframes或content属性。
    文章 · 前端   |  2个月前  |   479浏览 收藏
  • CSS响应式卡片悬停效果,触摸禁用hover动画
    CSS响应式卡片悬停效果,触摸禁用hover动画
    应禁用触摸设备的:hover动画,使用@media(hover:none)或(any-hover:none)精准拦截;卡片默认静态,仅在(hover:hover)且(pointer:fine)时启用transform/opacity动画;iOS点击跳变需加-webkit-tap-highlight-color:transparent和touch-action:manipulation。
    文章 · 前端   |  2个月前  |   479浏览 收藏
  • 修改网页HTML内容的实用技巧
    修改网页HTML内容的实用技巧
    可通过浏览器开发者工具临时修改网页内容。一、右键“检查”进入Elements面板,双击编辑文本或“EditasHTML”调整结构;二、在Console执行JavaScript代码,用innerText或innerHTML批量修改元素内容;三、右键复制修改后的outerHTML,粘贴保存为.html文件以保留更改;四、安装“WebScraper”等插件,通过可视化界面高效编辑并导出结果。
    文章 · 前端   |  2个月前  |   如何编辑网页html 479浏览 收藏
  • TensorFlow.js人脸检测教程详解
    TensorFlow.js人脸检测教程详解
    人脸检测是使用JavaScript在浏览器中识别图像或视频中人脸的技术,借助TensorFlow.js可在客户端运行模型实现此功能。1.可选择face-api.js或TensorFlowHub上的预训练模型进行检测;2.模型选择需权衡精度与速度,如tinyFaceDetector适合移动端实时检测;3.检测结果包含人脸框坐标和置信度,可用于绘制人脸框或后续分析;4.性能优化可通过轻量模型、降低分辨率、WebWorkers、代码优化及GPU加速实现;5.常见问题如光照、遮挡等可通过数据增强、复杂模型或多模型
    文章 · 前端   |  2个月前  |   479浏览 收藏
  • CSS过渡常见问题:位置与触发错误解析
    CSS过渡常见问题:位置与触发错误解析
    CSS过渡必须写在常态选择器中且目标属性需有明确数值起止值;display等不支持属性需用opacity或max-height替代;JS动态修改时须强制重排确保动画触发。
    文章 · 前端   |  2个月前  |   479浏览 收藏
查看更多
课程推荐
  • 前端进阶之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 工作流和沉淀团队常用智能体能力。
    3092次使用
  • MELO音乐 - AI 音乐生成平台,支持多模态创作能力
    MELO音乐
    MELO音乐是一站式AI视频与音乐制作助手,对标suno, udio的高品质体验。提供伴奏生成、原创写词、无损导出、哼唱识曲、混音变声等全套音频与短视频编辑工具。无论是流行Kpop、电音说唱、民谣古风、摇滚儿歌还是商用轻音乐,MELO为你免费谱曲,轻松做同款!
    2850次使用
  • UniScribe - AI 免费在线音视频转文字平台
    UniScribe
    UniScribe 是一款 AI 音视频转文字与内容整理工具,支持上传音频、视频文件或粘贴 YouTube 链接,自动生成转写文本、摘要、思维导图和关键问题,并支持多格式导出,适合会议记录、课程学习、访谈整理和内容创作复盘。
    2798次使用
  • 剧云 - 免费 AI 智能中文剧本创作平台
    剧云
    剧云是专业中文剧本创作平台,安全稳定运行十余年,集成AI编剧、剧本医生审核、人物小传、剧情关系图、大纲编写、多人协作、Word导入导出、版权管控功能,数据安全防护,轻松高效创作剧本。
    3017次使用
  • 万象有声 - AI 一站式有声内容创作平台
    万象有声
    万象有声,一个专为有声创作者打造的新一代智能有声内容创作平台。平台提供专业的智能拆章、智能画本编辑、AI配音、AI生成音效、后期制作、智能对轨、智能审听等有声创作全流程工具,可以帮助创作者高效、低成本创作出引人入胜的有声作品。立即体验,让有声书制作更简单!
    2966次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议隐私政策
返回登录
  • 重置密码