gpt4 book ai didi

html - 标题 Logo 或背景图像使用 IMG 元素更好,为什么?

转载 作者:塔克拉玛干 更新时间:2023-11-03 02:47:51 25 4
gpt4 key购买 nike

<分区>

我经常看到像 stackoverflow 这样的网站将他们的 Logo 嵌入为背景图像,并为屏幕阅读器的文本添加了 span 标签。

<a href="https://stackoverflow.com" class="-logo js-gps-track">
<span class="-img _glyph">Stack Overflow</span>
</a>

为什么要这样做而不是使用带有替代文本的 img 元素?有一些语义原因吗?一些可访问性原因? SEO原因?

它不适用于在图像未加载的情况下设置回退文本的样式。您可以设置替代文字的样式...

这不是为了性能 - 因为对于 img,您可以使用 srcset 和 sizes 来提供替代的较小图像,而 CSS 唯一接近 srcset 和 sizes 的规范尚未得到很好的支持。

我唯一认为它有意义的时候是当一个 spritesheet 被用于一个站点时(比如堆栈溢出。)

如果是为了防止人们“窃取” Logo ,那似乎很愚蠢,因为简单的谷歌搜索就会告诉别人如何获取背景图片的 url。如果那是推理,它仍然看起来很愚蠢,因为您可以在图像本身上使用 pointer-events:none;,并将包装链接设置为 display:inline-block;,它仍然是一个可点击的链接,没有人能够右键单击并另存为。

我只是想了解这样做是否有优势。

我四处搜索,但没有真正找到任何有用的信息来回答为什么要这样做。

有人将此标记为重复: When to use IMG vs. CSS background-image?他们不是同一个问题。这是您在网络上看到的特定做法和模式,其背后的原因可能与其他帖子中的答案不同。

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com