论坛
标题: 网页制作流程 [打印本页]
作者: 代号0 时间: 2016-9-11 21:45
标题: 网页制作流程
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body {
font-family: "宋体";
font-size: 18px;
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: 729px;
width: 310px;
}
#box_8 {
float: left;
height: 154px;
width: 310px;
}
#box_10 {
float: left;
height: 269px;
width: 310px;
}
#box_11 {
float: left;
height: 244px;
width: 310px;
}
#box_13 {
float: left;
height: 356px;
width: 310px;
}
#box_a {
float: left;
height: 752px;
width: 310px;
}
#box_b {
float: none;
height: 1752px;
width: 1097px;
margin: 0px auto;
}
#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_9 {
float: right;
height: 393px;
width: 787px;
}
#box_12 {
float: right;
height: 600px;
width: 787px;
}
#box_14 {
height: 146px;
width: 1097px;
margin: 0px auto;
}
#box_15 {
height: 270px;
width: 1097px;
margin: 0px auto;
}
#box_16 {
height: 125px;
width: 1097px;
margin: 0px auto;
}
</style>
</head>
<body>
<div id="box_1"><img src="切片/11_16_01.gif" width="1097" height="56" /></div>
<div id="box_2"><img src="切片/11_16_02.gif" width="1097" height="59" /></div>
<div id="box_3"><img src="切片/11_16_03.gif" width="1097" height="101" /></div>
<div id="box_b">
<div id="box_a">
<div id="box_4"><img src="切片/11_16_04.gif" width="310" height="729" /></div>
<div id="box_8"><img src="切片/11_16_08.gif" width="310" height="154" /></div>
<div id="box_10"><img src="切片/11_16_10.gif" width="310" height="269" /></div>
<div id="box_11"><img src="切片/11_16_11.gif" width="310" height="244" /></div>
<div id="box_13"><img src="切片/11_16_13.gif" width="310" height="356" /></div>
</div>
<div id="box_5"><img src="切片/11_16_05.gif" width="246" height="327" /></div>
<div id="box_6"><img src="切片/11_16_06.gif" width="541" height="327" /></div>
<div id="box_7"><img src="切片/11_16_07.gif" width="787" height="432" /></div>
<div id="box_9"><img src="切片/11_16_09.gif" width="787" height="393" /></div>
<div id="box_12"><img src="切片/11_16_12.gif" width="787" height="600" /></div>
</div>
<div id="box_14"><img src="切片/11_16_14.gif" width="1097" height="146" /></div>
<div id="box_15"><img src="切片/11_16_15.gif" width="1097" height="270" /></div>
<div id="box_16"><img src="切片/11_16_16.gif" width="1097" height="125" /></div>
</body>
</html>
作者: 潜意式 时间: 2016-9-12 19:00
基本的布局会了，实际设计中，切图还需要更细致，就是能用代码编写的，尽量不用图片。
| 欢迎光临 论坛 (http://bbs.qinxue.com/) |
Powered by Discuz! X3.1 |