论坛

标题: 网页制作 [打印本页]

作者: bymoo 时间: 2016-1-25 21:47
标题: 网页制作
本帖最后由 bymoo 于 2016-1-25 22:25 编辑

[attach]37560[/attach]
[attach]37561[/attach]
[attach]37562[/attach]
[attach]37563[/attach]
[attach]37564[/attach]

运行结果：

代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>网页制作</title>
<style type="text/css">
body {
font-family: "Arial Unicode MS";
font-size: 18px;
margin: 0px auto;

}
#box{
height: 1000px;
width: 1097px;
margin: 0px auto;

}
#box_1 {
height: 56px;
width: 1097px;
margin: 0px auto;

}
#box_2 {
height: 59px;
width: 1097px;
margin: 0px auto;
}
#box_3 {
height: 101px;
width: 1097px;
margin: 0px auto;
}
#box_4 {
float: left;
height: 1152px;
width: 310px;
}
#box_5 {
float: left;
height: 327px;
width: 246px;

}
#box_6 {
float: left;
height: 327px;
width: 541px;

}
#box_7 {
float: left;
height: 432px;
width: 787px;
}
#box_8 {
float: left;
height: 393px;
width: 787px;
}
#box_9 {
float: left;
height: 269px;
width: 310px;
}
#box_9 {
float: left;
height: 600px;
width: 310px;
}
#box_10 {
float: left;
height: 600px;
width: 787px;
}
#box_11 {
float: left;
height: 146px;
width: 1097px;
}
#box_12 {
float: left;
height: 270px;
width: 1097px;
}
#box_13 {
float: left;
height: 125px;
width: 1097px;
}
</style>
</head>
<body>
<div id="box">
<div id="box_1"><img src="images/11_01.gif" width="1097" height="56" alt="标题栏"></div>
<div id="box_2"><img src="images/11_02.gif" width="1097" height="59" alt="导航区"></div>
<div id="box_3"><img src="images/11_03.gif" width="1097" height="101" alt="广告搜索区"></div>
<div id="box_4"><img src="images/11_04.gif" width="310" height="729" alt="产品分类区"><img src="images/11_08.gif" width="310" height="154" alt="功能推荐区"><img src="images/11_10.gif" width="310" height="269" alt="广告区"></div>
<div id="box_5"><img src="images/11_05.gif" width="246" height="327" alt="广告区"></div>
<div id="box_6"><img src="images/11_06.gif" width="541" height="327" alt="新品区"></div>
<div id="box_7"><img src="images/11_07.gif" width="787" height="432" alt="特供区"></div>
<div id="box_8"><img src="images/11_09.gif" width="787" height="393" alt="推荐、畅销区"></div>

<div id="box_9"><img src="images/11_11.gif" width="310" height="244" alt="友情链接"><img src="images/11_13.gif" width="310" height="356" alt="广告区"></div>

<div id="box_10"><img src="images/11_12.gif" width="787" height="600" alt="人气产品区"></div>
<div id="box_11"><img src="images/11_14.gif" width="1097" height="146" alt="广告区"></div>
<div id="box_12"><img src="images/11_15.gif" width="1097" height="270" alt="售后服务区"></div>

<div id="box_13"><img src="images/11_16.gif" width="1097" height="125" alt="版权区"></div>
</div>
</body>
</html>

作者: bymoo 时间: 2016-1-25 22:26
不会整张上传

作者: yuanxi52028 时间: 2016-1-26 16:05
如果用浏览器打开没有错位的，就说明代码没有问题。

然后，其实那有黑边是要裁掉的，不是网页的一部分，练操作的。

作者: bymoo 时间: 2016-1-26 17:01

yuanxi52028 发表于 2016-1-26 16:05
如果用浏览器打开没有错位的，就说明代码没有问题。

然后，其实那有黑边是要裁掉的，不是网页的一部分，练 ...

用什么裁掉，求指教

作者: 潜意式 时间: 2016-1-26 17:45
ps里面裁剪一下就好了

欢迎光临论坛 (http://bbs.qinxue.com/)