svg

一颗红心,三手准备,分别基于图片(img)/SCSS(样式)/SVG动画实现动态拉轰的点赞按钮特效

    华丽炫酷的动画特效总能够让人心旷神怡,不能自已。艳羡之余,如果还能够探究其华丽外表下的实现逻辑,那就是百尺竿头,更上一步了。本次我们使用图片、SCSS样式以及SVG图片动画来实现“点赞”按钮的动画特效,并比较不同之处。    图片实现        最简单,也最容易理解的实现方式就是使用图片。曾几何时,几乎所有前端特效都需要借助图片来完成。    实现原理很简单,通过不同的关键帧来“拼接”......

一颗红心,三手准备,分别基于图片(img)/SCSS(样式)/SVG动画实现动态拉轰的点赞按钮特效

见微知著,细节上雕花:SVG生成矢量格式网站图标(Favicon)探究

    Favicon是favorites icon的缩写,也被称为website icon(站点图标)、page icon(页面图标)或者urlicon(URL图标)。Favicon是与某个站点或网页相关联的图标,网站设计者可以多种方式建立这种图标,几乎所有浏览器都支持此功能,浏览器可以将favicon显示于浏览器的地址栏中,也可置于书签列表的网站名前,还可以放在标签式浏览界面中的页标题前:    我们定义一个favicon的方法是将一个名为“favic......

见微知著,细节上雕花:SVG生成矢量格式网站图标(Favicon)探究

Logo小变动,心境大不同,SVG矢量动画格式网站Logo图片制作与实践教程(Python3)

    曾几何时,SVG(Scalable Vector Graphics)矢量动画图在坊间称之为一种被浏览器诅咒的技术,只因为糟糕的硬件支持(IE),和没完没了的兼容性调优(Safari)。但是在2022年的今天,一切都不一样了,正所谓三十年河东,三十年河西,微软所研发的采用Chromium内核作为IE替代者的Edge浏览器已经有望超越Safari成为第二大桌面浏览器,而曾经因为不支持关键帧动画被人诟病的Safari也统一了标准,市面上除了老帮菜IE,几乎所有平台(包括移动......

Logo小变动,心境大不同,SVG矢量动画格式网站Logo图片制作与实践教程(Python3)

Python3.7将普通图片(png)转换为SVG图片格式并且让你的网站Logo(图标)从此”动”起来

    在之前的几篇文章中,介绍了业界中比较火爆的图片技术SVG(Scalable Vector Graphics),比如 Iconfont(矢量图标)+iconmoon(图标svg互转)配合javascript来打造属于自己的个性化社交分享系统 ,我们可以使用svg来打造精美炫酷的分享小图标(icon),这一次我们使用python来将普通的静态的网站logo图片转换为带路径(path)的svg图片,这样就可以让网站logo能够变成动态的,作为一名不折腾不......

Python3.7将普通图片(png)转换为SVG图片格式并且让你的网站Logo(图标)从此”动”起来

Iconfont(矢量图标)+iconmoon(图标svg互转)配合javascript来打造属于自己的个性化社交分享系统

    每一个应用程序,其实都会有分享的需求,比如一键分享一篇文章或者一些活动到微博或者微信亦或者是twitter等社交平台,因为人类是社交动物,而社交分享能够满足马斯洛需求金字塔情感和归属的需求以及受尊重的需求。另外网页的社交分享功能不仅可以满足阅读者,同时,对于网络应用本身,也可以相应的增加该网站的外部链接,比如微博豆瓣等线上粘性用户非常多的社交平台,如果是twitter或者facebook则可以带来一部分来自于国外的流量,对于网络平台来说,这样做即可以分发流量又可以引流......

Iconfont(矢量图标)+iconmoon(图标svg互转)配合javascript来打造属于自己的个性化社交分享系统