html - H2 中的图像(每个 h2 唯一)

标签 html css seo

<分区>

我创建了一个自定义 H2 CSS 标记,为 H2 提供了完整的蓝色背景和内部白色字母。

现在我想在其中一些 h2 中添加自定义小图标。

例如我有一个名为Features的h2,现在我想在它前面添加一个小齿轮图标。

在以下方面进行的最佳方式是什么: - 搜索引擎优化:在我的 h2 中放置图像是否有问题 - 编码:我只是将它添加为 H2 标签内部,但现在图像未居中对齐(垂直)。

最佳答案

这可以通过在 h2 元素中添加 img 元素来解决。

但请记住,由于这是一张装饰图片,您需要有一个空的 alt 属性。更多信息:Accessibility Tip: Empty alt Attributes

<h2>
  <img src="gear.svg" alt=""> 
  Features
</h2>

提示:使用 flexbox 来垂直对齐图标和文本

h2 {
  display: flex;
  align-items: center;
}

关于html - H2 中的图像(每个 h2 唯一),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50177986/

相关文章:

javascript - JS 在文本输入中显示未定义

html - 输入文本中固定的下划线

php - PHP:如果用户代理是搜索引擎爬虫,则不输出日期

PHP : SEO friendly urls

css - 使用 Gulp 根据媒体查询将 SASS/CSS 文件拆分为多个 CSS 文件?

jquery - 在 ASP.NET MVC 中延迟渲染阻塞 CSS 包

html - 我的自定义 Webfont 未在任何浏览器中呈现

javascript - 如何每 x 秒更改文本值?

html - 使用一个空的 div (<div/>) 和仅 css 创建特定元素

html - html 中的纯文本是否有自己的上边距,粘在上面?