跳至主要内容
CSS-Tricks
  • 文章
  • 笔记
  • 链接
  • 指南
  • 年鉴
  • 随机播放
搜索

文章标签
SVG

206 篇文章
{
,

}
文章的直接链接:哪种 SVG 技术最适合大量的图标?
SVG svg 图标

哪种 SVG 技术最适合大量的图标?

Tyler Sticka 深入研究,以最佳方式:通过 制作一个测试页面,并实际测量性能。也许 1000 个图标是一个极端情况,但嘿,250 行数据,每行有四个图标……

Avatar of Chris Coyier
Chris Coyier 于 2021 年 11 月 23 日
文章的直接链接:Favicons:如何确保浏览器只下载 SVG 版本
favicon SVG

Favicons:如何确保浏览器只下载 SVG 版本

Šime Vidas 几天前给我发了私信,内容是关于 这条推文,来自 Twitter 上的 subzey。我的 Favicons HTML 如下所示

<!-- Warning! Typo! --<link rel="icon" href="/favicon.ico" size="any"<link rel="icon" href="/favicon.svg" type="image/svg+xml"

属性 size 那里有错别字……

Avatar of Chris Coyier
Chris Coyier 于 2021 年 11 月 5 日
文章的直接链接:我如何使用 Sass 和 SMIL 选项制作一个 SVG 加载器生成器
生成器 加载器 Sass SMIL SVG

我如何使用 Sass 和 SMIL 选项制作一个 SVG 加载器生成器

在学习 Vue.js 的过程中,我开始构建免费的 Web 工具,涉及对 SVG 的探索,目标是学习两者的一些知识!让我们来看看其中一个工具:一个制作 SVG 加载器的生成器,以及……

Avatar of Mariana Beldi
Mariana Beldi 于 2021 年 8 月 26 日
文章的直接链接:剪切
剪切与遮罩 SVG

剪切

Ahmad Shadeed 研究了形状“剪切”。想象一个形状,从其中雕刻出另一个较小的形状。以他一贯全面且清晰的方式,Ahmad 很好地描述了情况——探讨了使问题复杂化的棘手情况……

Avatar of Chris Coyier
Chris Coyier 于 2021 年 8 月 16 日
文章的直接链接:SVG Gobbler
SVG

SVG Gobbler

很棒的小项目,来自 Ross Moody

SVG Gobbler 是一个浏览器扩展程序,可以找到您正在查看的页面上的矢量内容,并提供下载、优化、复制、查看代码或将其导出为图像的选项。

……
Avatar of Chris Coyier
Chris Coyier 于 2021 年 8 月 6 日
文章的直接链接:我在 SVG 中使用和动画化圆锥渐变的挣扎
圆锥渐变 加载器 混合模式 SVG

我在 SVG 中使用和动画化圆锥渐变的挣扎

我工作的这家很棒的公司,Payoneer,有一个新的 logo,我的工作是为应用程序中的加载器组件重新创建并动画化它。我将解释我究竟是如何做到的,分享我遇到的问题……

Avatar of Amit Sheen
Amit Sheen 于 2021 年 7 月 8 日
文章的直接链接:如何使用有趣的形状、字形和表情符号创建 CSS 图表
图表 CSS 形状 表情符号 字形 SVG

如何使用有趣的形状、字形和表情符号创建 CSS 图表

让我们放弃图表中通常使用的普通圆形和条形,使用更奇特的形状。如今,在线演示越来越普遍,快速改变 Web 幻灯片的外观,使其脱颖而出的一种方法是……

Avatar of Preethi
Preethi 于 2021 年 6 月 21 日
文章的直接链接:使用 CSS 和 SVG 滤镜为 SVG 图标添加阴影
投影 过滤器 阴影 SVG SVG 过滤器

使用 CSS 和 SVG 滤镜为 SVG 图标添加阴影

为什么我们需要为 SVG 应用阴影?

  1. 阴影是一个常见的视觉效果,可以帮助元素(例如图标)脱颖而出。它们可以是永久的,也可以在不同的状态(例如 :hover、:focus 或 :active)下应用。
……
Avatar of Joel Olawanle
Joel Olawanle 于 2021 年 6 月 11 日
文章的直接链接:svg-loader:一种不同的处理外部 SVG 的方式
SVG SVG use

svg-loader:一种不同的处理外部 SVG 的方式

SVG 太棒了:它们很小,在任何比例下都看起来清晰,并且可以自定义而无需创建单独的文件。但是,我认为当今的 Web 标准中缺少一些东西:一种将它们作为外部……

Avatar of Shubham Jain
Shubham Jain 于 2021 年 5 月 19 日
  • 更新
  • 1
  • 2
  • 3
  • ...
  • 23
  • 较旧的

CSS-Tricks 由 DigitalOcean 提供支持。

了解最新的 Web 开发信息

通过我们手工制作的时事通讯

DigitalOcean
  • 关于 DO
  • Cloudways
  • 法律信息
  • 获取免费积分!
CSS-Tricks
  • 为我们写文章!
  • 与我们做广告
  • 联系我们
社交媒体
  • RSS 订阅
  • CodePen
  • Mastodon
  • X
返回顶部

© 2024 . All rights reserved.