来做一个导航:
<style typr="text/css">
*{margin:0padding:0border:0}
.navbg{background:redheight:50px}
.nav{width:980pxheight:50pxmargin:0 auto}
li{float:leftmargin:10pxline-height:30px}
</style>
<div class="navbg">
<div class="nav">
<ul>
<li>首页</li>
<li>联系我们</li>
<li>留言</li>
</ul>
</div>
</div>
放在<body>里试一下便知
如果<style>里再加一句 body{width:980pxmargin:0 auto}则不能铺满屏幕,只有980px。
1、首先准备一张设置为背景的图片,这边准备的是一张650px*347px的图片。
2、然后建立一个html文档,将它和背景图片放到一个文件夹中。
3、编辑html文档,这边建立一个div,设置宽度为700px,高度跟背景图一样,为347px。
4、就给div设置背景图片。
5、在浏览器中预览会发现图片平铺了,这不是想要的效果。
6、然后可以给div再加上属性,-moz-background-size:100% 100%background-size:100% 100%。
7、这样设置后就会发现背景图片拉伸至100%了。
图片的宽度被你设置成3象素了,也就是平铺出来的宽度只有3px那么一点,所以只有左边显示那么一点!把宽高都改成百分数吧,方便,这样就行了!
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>signal</title>
<style type="text/css">
#signal{
width:100%
height:100%
background-image:url(images/signal_r3_c15.jpg)
background-repeat:repeat-x
</style>
</head>
<body>
<div id="signal">
</div>
</body>
</html>