img插入的图片会显示,而你用background弄的背景不会显示出来。
用 img 还是 css背景 就业根据你的内容来定了,大体原则是尽量页面设计表现上的东西用背景,产品、照片等内容用 img 插入。
比如一个网页正文上的大标题 h1~h6 ,本来这样就可以实现:
<h1>某某公司发展大事记</h1>
<p>1992年,那是一个春天,有个老头在我国的南边划了一个圈...</p>
<img src="123.jpg" alt="那个老人的照片" />
<p>2011年,我公司著名程序猿张小龙在微信上面又划了一个圈...</p>
<img src="234.jpg" alt="张小龙开发微信的照片" />
为了设计上的美观,某某公司发展大事记 这几个字要设计成独特又不常用的字体,那就得做成图片,然后这里就该 html 代码不变,用背景图来展示:
<h1 id="test">某某公司发展大事记</h1>
#test{
1.设成图片宽高
2.块级元素
3.background: url(载入背景图)
4.文本缩进 -1000em 把文字隐藏掉
}
这样人看到的是图片文字标题,对于抓取你页面的程序,它们看到的是更适合它们胃口的<h1>字段文字。接下来那两张重要的很能体现你公司高大上形象的照片,就要用 img 插入了,否则,没样式时人看不到,搜索引擎、Rss订阅器等程序爬你网页时,也看不到。
img必须写在一行<HTML>
<HEAD>
<TITLE>New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style type="text/css">
*{
margin:0
padding:0
}
img{
width:120px
height:350px
border:solid black 1px
}
</style>
</HEAD>
<BODY>
<div>
<img src="1.jpg"/><img src="2.jpg"/><img src="3.jpg"/><img src="4.jpg"/><img src="1.jpg"/><img src="2.jpg"/>
</div>
</BODY>
</HTML>