深圳幻海软件技术有限公司 欢迎您!

  • 队列-我的基础算法刷题之路(六)

    本篇博客旨在整理记录自已对队列的一些总结,以及刷题的解题思路,同时希望可给小伙伴一些帮助。本人也是算法小白,水平有限,如果文章中有什么错误之处,希望小伙伴们可以在评论区指出来,共勉💪。本篇文章主要是讲一下基本的队列以及刷题,暂不过多涉及双端、阻塞队列。文章目录一、队列的概述二、Java队列的特性三

  • 记录--vue.config.js 的完整配置(超详细)!

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助前段时间,对部门的个别项目进行Vue3.0+ts框架的迁移,刚开始研究的时候也是踩坑特别多,尤其我们的项目还有些特殊的webpack配置,所以,研究vue.config.js的配置的时候也是查阅了各种资料文档,最终,完成了项目webpack

  • 5 分钟速通 SVG

    前言SVG对不少前端来说就是一个熟悉的陌生人,此篇博客是我学习完SVG后做的一个小总结,帮助我快速回忆SVG相关内容。它不能帮你精通SVG,但是可以帮你快速了解SVG的一些核心内容,不会迷失在一些细枝末节的设定中,让你对SVG有一个大概的认识。基础SVG,全名ScalableVectorGraphi

  • vue3 vite2 封装 SVG 图标组件 - 基于 vite 创建 vue3 全家桶项目续篇

    在《基于vite创建vue3全家桶》一文整合了ElementPlus,并将ElementPlus中提供的图标进行全局注册,这样可以很方便的延续ElementUI的风格——通过el-icon-xxx的方式使用图标(如果有问题的朋友可以先阅读前面的文章:基于Vite创建vue3全家桶项目)。在真实的企业

  • D3 笔记

    D3D3orD3.js代表"DataDrivenDocuments"选中、添加元素select()方法从文档中选择一个元素,它接收目标元素的名称作为参数并返回第一个匹配该名称HTML节点。举例:constanchor=d3.select('a');append()方法接收添加到文档中的元素,它会把该

  • 前端动效讲解与实战

    作者:vivo互联网前端团队-ZhaoJie本文将从各个角度来对动画整个体系进行分类,并且介绍各种前端动画的实现方法,最后我们将总结在实际开发中的各个场景的动画选择方案。一、背景前端动画场景需求多对众多动画场景的技术实现方案选择上比较模糊各动画方案的优劣及适用场景认识模糊现有动画库太多,不知道选哪个

  • CSS & SVG 绘制写作网格线的三种方式

    最近有同事问我这样一个问题:需要绘制一个自适应文本的写作网格线,设计稿是这样的。写作网格其实就是一行行虚线,要求如下:虚线的纵向间隔要跟随行高自适应,确保文本在每一栏虚线上。虚线后面的背景是动态的,可以是纯色,可以是渐变,也可以是图片。绘制这样的虚线,看似容易,其实暗藏玄机,下面一起看看有哪些实现方

  • CSS 如何实现羽化效果?

    最近碰到这样一个问题,在一张封面上直接显示书名,可能会存在书名看不太清楚的情况(容易受到背景干扰),如下为了解决这个问题,设计师提了一个“究极”方案,将书名背后的图片模糊一下,这个在CSS中很好实现,仅需backdrop-filter即可复制.name{backdrop-filter:blur(10

  • CSS、SVG、Canvas对特殊字体的绘制与导出

    最近在项目中需要对特殊字体进行绘制与导出,如下:简单解释一下:所谓绘制,就是视觉上可以看到就行(预览状态),导出呢,就是将看到的转换成图片(或者Canvas),以便于后续处理。这里总结了3种方式,分别是CSS、SVG、Canvas,来看看各自有什么差异和优缺点吧一、CSS的绘制与导出首先来看CSS,

  • 使用 SVG 和 CSS 构建 UI 组件

    SVG不仅仅是图标和插图,它还有很多我们开发人员有时会忘记的隐藏力量。与CSS相比,使用SVG有很多用途。例如,构建循环加载动画,或在图像上应用蒙版,在这种情况下,这并不意味着无法使用CSS,但有时基于所使用的技术(例如:掩码)来解决跨浏览器问题可能会很痛苦,因此,使用SVG可以节省时间和精力。SV

  • 由 transform 被占用引发的思考

    一、transform很容易被占用众所周知,CSS 中的transform是一个包含很多值的属性,例如:复制div{transform:translate(-50%,-50%)scale(1.5)}1.2.3.但是,这并不是简写,而是就该这么写,这一点和background不一样。复制di

  • 定制一个 Vue 3 模板 - 集成 Vite, Pinia, Vue Router 与 Tailwind CSS

    不久前,我意识到我正在用一些重复使用的后台基础模板,浪费了我一些摸鱼时间,我突然想到--为什么不把这些可重复使用的部分重新利用起来,把它们简单地堆在一个模板里呢?技术栈这个后台模板中,用到了如下的框架或库:VitePiniaVueRouterTailwindCSSViteSVGloader前提开始之

  • 16个实用的背景生成器工具

    曾经是否努力为产品、品牌和界面创造引人入胜的视觉效果?在策划网站UI上看到的设计通常需要专业设计技能或大量练习。其实,如果我们有一些好的工具,我们就可以快速的实现一些比较有创意的效果。在这篇文章中,我整理了一些我最喜欢的背景生成器工具。有全方位工具、渐变生成器、SVG背景、图案等类别,我对它们进行了

  • 借助 SVG 生成带标识的 Favicon

    之前做了一个Chrome插件,可以用于区分不同的开发环境,效果如下:主要实现过程其实不复杂,首先获取网站favicon,然后给favicon添加标识,重新绘制生成就行了。其中,这里的图标就是通过SVG生成的,下面看看具体实现吧。一、favicon的获取方式想知道获取方式,可以先了解设置方式。一般有两

  • 一篇文章带你了解SVG JavaScript脚本

    当SVG嵌入HTML页面中时,可以在JavaScript中使用SVG元素,可以使用JavaScript编写SVG脚本。通过编写脚本,可以修改SVG元素,设置它们的动画,或者监听形状上的鼠标事件。当SVG嵌入到HTML页面中时,可以在JavaScript中使用SVG元素,就像它们是HTML元素一样。J

  • 用 SVG 描边动画送一份平安夜祝福

    今晚是平安夜,提前给大家送份祝福。SVG是用Illustrator画的,苹果是手绘的(虽然是画的丑了点0.0)。按照惯例,看完效果之后我们来学习下它的实现原理。思路分析SVG是网页上画矢量图的技术,有line(线)、polyline(折线)、polygon(多边形)、react(矩形)、circle

  • 适合前端开发和UI设计的20多个优秀ICON 库

    在应用界面中图标的存在,会给用户一个良好第一印象,这个挺重要的。但是从零开始开发图标需要大量的时间和金钱。在你的网站上使用图标可以让你有效地与你的访问者交流:它们增加了可读性,突出了重要的内容,加强了功能或特性,增强了设计。因此,使用现成图标是很好的一个选择。优秀图标库的列表这里阿里的iconfon

  • 在Node.js中将SVG图像转换为PNG,JPEG,TIFF,WEBP和HEIF格式

    介绍你需要将SVG文件转换为PNG、JPEG、TIFF、WEBP和HEIF格式吗?本文将指导你如何转换为所有这些类型的格式。我们将使用Node.js和Sharpnpm包来完成大部分繁重的工作。目录 安装SharpNpm包 SVG转PNG SVG转JPEG SV

  • 设计更快的网页(二):图片替换

    欢迎回到我们为了构建更快网页所写的系列文章。上一篇文章讨论了只通过图片压缩实现这个目标的方法。这个例子从一开始有1.2MB的“浏览器脂肪”,然后它减轻到了488.9KB的大小。但这还不够快!那么本文继续来给浏览器“减肥”。你可能在这个过程中会认为我们所做的事情有点疯狂,但一旦完成,你就会明白为什么要

推荐阅读