Html 在我网站的标题中设置 img
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9588320/
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
set up img in the header of my website
提问by eng_mazzy
I'm building a web site and I'm using HTML5. I'd insert into my header an img that is my company's logo. In terms of efficient and correctness it is better set up css propriety as background-image: url("logo.gif")
in my css style or including in the html file
我正在建立一个网站,我正在使用 HTML5。我会在我的标题中插入一个 img,它是我公司的标志。在效率和正确性方面,最好像background-image: url("logo.gif")
我的 css 样式一样设置 css 属性或包含在 html 文件中
<header>
<img src="logo.gif" alt="logo" />
</header>
回答by Curt
It is best to include the image as an img
tag, not a background-image
.
最好将图像作为img
标签包含,而不是background-image
.
This means that if the client has disabled CSS on their browser, or it doesn't support CSS, they will still be able to see the logo at the top of the page.
这意味着如果客户端在他们的浏览器上禁用了 CSS,或者它不支持 CSS,他们仍然可以看到页面顶部的徽标。
This would also mean you could make the logo a link to the home page, which has become a general usability point for websites these days:
这也意味着您可以使徽标成为主页的链接,这已成为当今网站的一般可用性点:
<header>
<a href="/index.html"><img src="logo.gif" alt="logo" /></a>
</header>
For more information on this sort of situation, see this popular StackOverflow post:
有关此类情况的更多信息,请参阅此流行的 StackOverflow 帖子:
回答by 1b0t
that depends.
那要看。
If your logo should be clickable then include it in the HMTL. (usebility)
如果您的徽标应该是可点击的,则将其包含在 HMTL 中。(可用性)
If it is only present for design purposes go with the CSS.
如果它仅用于设计目的,请使用 CSS。
It is generally a better idea to define everything related to the appearance of the Website in the CSS.
通常最好在 CSS 中定义与网站外观相关的所有内容。
html:
html:
<header>
<div id="company_logo"></div>
</header>
css:
css:
#company_logo{
width:50px;
height:50px;
background-image:url();
}
回答by Ricardo Casta?eda
Background images can not be printed, if your site has the purpose of being printed, then your logo won't display.
背景图片无法打印,如果您的网站有被打印的目的,那么您的标志将不会显示。
Remember that a logo is a content, and a background is a style. Using a background as a logo is not semantic.
请记住,徽标是一种内容,背景是一种风格。使用背景作为标志是不符合语义的。
回答by Alexander Pavlov
Unless you need to have some contents over your logo, I'd go for the <img>
tag (it is also screen reader-friendly provided you have the "alt" text).
除非你需要在你的标志上添加一些内容,否则我会选择<img>
标签(如果你有“alt”文本,它也是屏幕阅读器友好的)。