html - SE 是如何设计缩放时质量保持良好的收件箱篮子图片的?

标签 html css image

<分区>


我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题,以便用事实和引用来回答。

关闭 7 年前

我想知道 Stack Exchange 收件箱篮子图标(/图片)的设计方式。

因为如果它是图标或图片,它的质量会随着缩放而降低。

这也不是(字体系列的)字母!

所以我尝试检查 firefox 的元素,它引导我到这个页面:

http://cdn.sstatic.net/img/share-sprite-new.svg?v=698e8b939ec0

我的第一个想法是这是一张图片,如果需要的话,它的特定坐标会显示在不同的地方。但是,那不是图片也不是图标,因为我无法选择它也无法保存它。

即当我右键单击它时,没有另存为图片按钮。

那是什么?

最佳答案

它被称为“可缩放矢量图形”。通过以下方式创建的图像:

This line starts [here] and ends [here] and is this [color] & [thickness]

不完全是,但本质上是那种东西。比充满像素的文件好多了!

此外,它是单个文件,这意味着对服务器的调用更少...如果您一直加载大量小图像文件(例如 Logo 、按钮等),可能会减少很多...

关于html - SE 是如何设计缩放时质量保持良好的收件箱篮子图片的?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34574229/

上一篇:css - 下拉导航背景使两个形状不是一个

下一篇:javascript - 移除底部li时自动在底部制作其他li

相关文章:

javascript - 绝对位置和滚动问题

html - 如何将我的列表居中?

image - Flutter 在运行时高效地加载图像

PHP:如果指定的图像不存在,如何显示默认图像?

html - 当我们知道 key 时如何显示 map 的内容

css - 无法正确放置 <div>

jquery - 移动灯箱?

jquery - 像这个示例网站上那样实现略圆 Angular 的最简单方法是什么?

javascript - 滚动时动画固定导航 - 错误

Javascript 函数可在单击一张图像时更改各种图像