图片包括任何的标签都是不能默认绝对居下的,都是需要通过css样式控制的,这个就要用到定位。给img添加一个绝对定位position:absoluteleft:0bottom:0也需要给它的某个父级添加一个相对定位。
img标签是向网页中嵌入一幅图像。
注意,从技术上讲,<img>标签并不会在网页中插入图像,而是从网页上链接图像。<img>标签创建的是被引用图像的占位空间。
<img>标签有两个必需的属性:src 属性 和 alt 属性。
二楼说的甚是我来帮你完整解决一下残留的问题吧
两种解决方法
先说原因吧,原因就是LOGO是通过背景图片导入的
#header {
background:url("../../templates/teakiagy/images/logo.jpg") no-repeat scroll 100px 50% transparent
height:100px
margin-bottom:0
overflow:hidden
}
#header {
background:none repeat scroll 0 0 #373A3C
border-bottom:0 solid #373A3C
margin-bottom:8px
min-width:980px
width:100%
而怪就怪在你有两份儿#header。宽度是执行的第二个width:100%,而不是980px,就不会随着下面的内容一起居中。
所以,解决方法就是
一,更改为width:980px
二,重新写hmtl中logo的代码,你可以写一个<span class="logo">logo</span>,CSS代码 .logo{display:block背景图片地址指向logo,宽度,高度大小与logo一致,}
显然第一种方法简单……
加油
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<html>
<head>
<style>
#aa{
float:left}
#main_footer_zw {text-align:leftmargin-bottom:8pxfloat: leftwidth: 690px}
#main_footer_zw ul {display:inlinemargin:0 autotext-align: leftfloat: leftpadding-top: 0padding-right: 0padding-left:1pxmargin-top:4px}
#main_footer_zw ul li {float:leftdisplay:inlinewidth:224pxfloat:lefttext-align:leftmargin-top: 8pxmargin-bottom: 0pxmargin-left: 2pxpadding: 0px}
#main_footer_zw ul li a {float:leftdisplay:inlinefloat: none}
#main_footer_zw ul li img { margin-bottom:1px}
</style>
<title</title>
<body>
<div id="main_footer_zw">
<ul>
<li><a href="#"><img class="aa" src="images/cy_06_08.jpg" width="224" height="180" border="0" onMouseOver="this.src='images/cy_06_08x.jpg'" onMouseOut="this.src='images/cy_06_10.jpg'"/></a>
</li>
<li><a href="#"><img src="images/cy_06_10.jpg" width="224" height="180" border="0" onMouseOver="this.src='images/cy_06_10x.jpg'" onMouseOut="this.src='images/cy_06_10.jpg'"/></a>
</li>
<li><a href="#"><img src="images/cy_06_12.jpg" width="224" height="180" border="0" onMouseOver="this.src='images/cy_06_12x.jpg'" onMouseOut="this.src='images/cy_06_12.jpg'"/></a>
</li>
</ul>
</div>
</body>
</html>