在我的网站标题中设置 img答案

【问题标题】：set up img in the header of my website在我的网站标题中设置 img
【发布时间】：2017-08-13 13:39:23
【问题描述】：

我正在构建一个网站，并且正在使用 HTML5。我会在我的标题中插入一个 img，它是我公司的徽标。就效率和正确性而言，最好在我的 css 样式中将 css 属性设置为 background-image: url("logo.gif") 或包含在 html 文件中

<header>
   <img src="logo.gif" alt="logo" />
</header>

【问题讨论】：

标签： css html

【解决方案1】：

最好将图像包含为img 标签，而不是background-image。

这意味着如果客户在他们的浏览器上禁用了 CSS，或者它不支持 CSS，他们仍然可以在页面顶部看到徽标。

这也意味着您可以将徽标作为主页链接，这已成为当今网站的一般可用性点：

<header>
   <a href="/index.html"><img src="logo.gif" alt="logo" /></a>
</header>

有关此类情况的更多信息，请参阅这篇流行的 StackOverflow 帖子：

【讨论】：

【解决方案2】：

这取决于。

如果您的徽标应该是可点击的，则将其包含在 HMTL 中。（实用性）

如果它仅用于设计目的，请使用 CSS。

通常最好在 CSS 中定义与网站外观相关的所有内容。

html:

<header>
     <div id="company_logo"></div>
</header>

css:

#company_logo{
width:50px;
height:50px;
background-image:url();
}

【讨论】：

【解决方案3】：

除非您需要在徽标上添加一些内容，否则我会选择 <img> 标签（如果您有“alt”文本，它也适合屏幕阅读器）。

【讨论】：

【解决方案4】：

背景图片不能打印，如果你的网站有打印的目的，那么你的logo就不会显示。

请记住，徽标是内容，背景是样式。使用背景作为徽标没有语义。

【讨论】：