can< figure> html5中的标签用于背景图片？ [英] can <figure> tag in html5 be used for background images?

问题描述

我开始阅读html5，我正在努力研究一个项目，以便我可以看到事情的工作方式。我知道标签可以像这样使用：

 < figure id =car> 
< img src =img / car.jpgalt =汽车> 
< p>汽车< / p> 
< / figure> 
  

尽管我需要这些数字中的6个，因此我想使用精灵和（除非我不知道重要的东西）只有当我添加图像宽度CSS（背景图像）时，精灵才会工作。所以我会做的是这样的：

 < figure id =car> 
< pre>< / pre> <！ - 从css添加图片 - > 
< p>汽车< / p> 
< / figure> 
  

可以使用这样的数字标记吗？

非常感谢

解决方案

figure和figcaption元素在语义上相当具体。如果你不关心语义，实际上没有太多的理由来使用它们。 Div可以正常工作。以下是应该如何使用图：

 < figure> 
 < figcaption>一种描述，可能会或可能不会专门描述图像，并伴随文章内容。< / figcaption> 
< / figure> 
  

编辑：我应该提到带背景的pre可能不是如何使用并且根本不会帮助屏幕阅读者。搜索引擎的机器人可能会有不同的反应，这可能会对您造成负面影响。

I started reading upon html5 and I am trying to work on a project so that I can see how things work. I know that the tag can be use like this:

<figure id="car">
   <img src="img/car.jpg" alt="the car">
   <p>The car</p>
</figure>

Though I need to have 6 of those figures, as such I want to use sprites and (unless I dont know something important) sprites only work if i add the image width css (background-image). So what I would do is something like:

<figure id="car">
   <pre></pre> <!-- add image from css -->
   <p>The car</p>
</figure>

can I use figure tag like that?

Thanks a lot

解决方案

The figure and figcaption elements are fairly specific in their semantic purpose. If you don't care for semantics, there is really not much of a reason to use them. Divs will work fine. Here is how figure should be used:

<figure>
  <img src="/image.jpg" alt="A description of what this image is">
  <figcaption>A description that may or may not describe the image specifically and accompanies content from within the article.</figcaption>
</figure>

edit: I should mention that a pre with a background is likely not how this is intended to be used and will not help people with screen readers at all. Bots for search engines may respond differently as well, which could be a negative for you.

这篇关于can< figure> html5中的标签用于背景图片？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！