Html 如何在 HTML5 中放置标题横幅图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18121785/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to put header banner image in HTML5
提问by Infinite Mystery
I'm just starting with HTML5 and CSS3. My design includes a header banner in top. That is, the logo and banner images all in one banner.
我刚开始使用 HTML5 和 CSS3。我的设计包括顶部的标题横幅。也就是说，徽标和横幅图像都在一个横幅中。
Now, in HTML5, how do I code it?
现在，在 HTML5 中，我该如何编码？
<header>
<figure></figure>
</header>
or
或者
<header>
<div>Image Header Banner</div>
</header>
回答by Danield
From your description, you wouldn't use <figure>here as you just need to add a logo/images.
根据您的描述，您不会<figure>在此处使用，因为您只需要添加徽标/图像。
The <figure>element is used when you need to group images with a caption.
<figure>当您需要对带有标题的图像进行分组时，将使用该元素。
From w3.org
来自w3.org
The figure element represents a unit of content, optionally with a caption, that is self-contained, that is typically referenced as a single unit from the main flow of the document, and that can be moved away from the main flow of the document without affecting the document's meaning.
图元素表示一个内容单元，可选带有标题，它是自包含的，通常作为文档主要流中的单个单元引用，并且可以从文档的主要流中移开而不需要影响文档的含义。
Instead you could place images using the <img />tag within your <header>
相反，您可以使用<img />标签内的标签放置图像<header>
<header>
<img />
<img />
</header>
or wrapped in a <div>container - depending on what you need.
或包裹在<div>容器中 - 取决于您的需要。
Also, check out this articleabout the <figure>element, in particular at the end of the article says this:
另外，请查看有关该元素的这篇文章<figure>，特别是在文章末尾这样说：
It may not always be appropriate to use the
<figure>element, though. For example, a graphic banner should not be marked up with<figure>. Instead, simply use the<img>element.
但是，使用该
<figure>元素可能并不总是合适的。例如，图形横幅不应标有<figure>。相反，只需使用该<img>元素。
回答by Tiago Silva
<header>
<figure>
<img src="image" alt="Logo" />
</figure>
</header>
