设为首页
收藏本站
开启辅助访问
请
登录
后使用快捷导航
没有帐号?
立即注册
首页
课程设置
平面设计
室内设计
机械设计
园林景观设计
影视后期制作
论坛
老师加盟
登录
|
注册
搜索
搜索
本版
帖子
用户
快捷导航
室内设计学院
论坛
BBS
论坛
›
学院
›
平面设计学院
›
第三节 网页制作
返回列表
xm10421396
0
主题
7920
帖子
7920
积分
金牌会员
金牌会员, 积分 7920, 距离下一级还需 2080 积分
金牌会员, 积分 7920, 距离下一级还需 2080 积分
积分
7920
加为好友
发送消息
访问家园
1
360
电梯直达
[作业]
第三节 网页制作
水墨洛洛
|
中级会员
|
勤币 471
|
学币 0
发表于 2016-3-8 23:51
|
复制链接
|
打印
|
上一主题
|
下一主题
网页美工设计入门详解
-
第三节 网页制作流程
1、
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title铛铛网</title>
<style type="text/css">
body,td,th {
font-family: "宋体";
font-size: 18px;
margin: 0px auto;
}
#box {
height: 2509px;
width: 1097px;
margin: 0px auto;
}
#box_1 {
height: 56px;
width: 1097px;
margin: 0px auto;
}
#box_2 {
height: 60px;
width: 1097px;
margin: 0px auto;
}
#box_3 {
height: 101px;
width: 1097px;
margin: 0px auto;
}
#box_4 {
float: left;
height: 1752px;
width: 301px;
}
#box_5 {
float: right;
height: 327px;
width: 246px;
}
#box_6 {
float: right;
height: 327px;
width: 541px;
}
#box_7 {
float: right;
height: 432px;
width: 787px;
}
#box_8 {
float: right;
height: 393px;
width: 787px;
}
#box_9 {
float: right;
height: 600px;
width: 787px;
}
#box_10 {
float: left;
height: 146px;
width: 1097px;
}
#box_12 {
float: left;
height: 125px;
width: 1097px;
}
#box_11 {
float: left;
height: 270px;
width: 1097px;
}
</style>
</head>
<body>
<div id="box">
<div id="box_1"><img src="图像/1.gif" width="1097" height="56" alt=""/></div>
<div id="box_2"><img src="图像/2.gif" width="1097" height="59" alt=""/></div>
<div id="box_3"><img src="图像/3.gif" alt="" width="1097" height="101" align="left"/></div>
<div id="box_4"><img src="图像/4.gif" width="310" height="729" alt=""/><img src="图像/8.gif" width="310" height="154" alt=""/><img src="图像/10.gif" width="310" height="269" alt=""/><img src="图像/11.gif" width="310" height="244" alt=""/><img src="图像/13.gif" width="310" height="356" alt=""/></div>
<div id="box_6"><img src="图像/6.gif" alt="" width="541" height="327" align="right"/></div>
<div id="box_5"><img src="图像/5.gif" alt="" width="246" height="327" align="right"/></div>
<div id="box_7"><img src="图像/7.gif" alt="" width="787" height="432"/></div>
<div id="box_8"><img src="图像/9.gif" width="787" height="393" alt=""/></div>
<div id="box_9"><img src="图像/12.gif" width="787" height="600" alt=""/></div>
<div id="box_10"><img src="图像/14.gif" width="1097" height="146" alt=""/></div>
<div id="box_11"><img src="图像/15.gif" width="1097" height="270" alt=""/></div>
<div id="box_12"><img src="图像/16.gif" width="1097" height="125" alt=""/></div>
</div>
</body>
</html>
2、
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>网页制作</title>
<style type="text/css">
body,td,th {
font-family: "宋体";
font-size: 18px;
margin: 0px auto;
}
#box {
height: 1079px;
width: 1003px;
margin: 0px auto;
}
#box_1 {
height: 74px;
width: 1003px;
margin: 0px auto;
}
#box_2 {
height: 363px;
width: 1003px;
margin: 0px auto;
}
#box_3 {
float: left;
height: 543px;
width: 183px;
}
#box_4 {
float: left;
height: 543px;
width: 820px;
}
#box_5 {
float: left;
height: 31px;
width: 1003px;
}
#box_6 {
float: left;
height: 70px;
width: 1003px;
}
</style>
</head>
<body>
<div id="box">
<div id="box_1"><img src="图像/商务网站二级页面_01.gif" width="1003" height="73" alt=""/></div>
<div id="box_2"><img src="图像/商务网站二级页面_02.gif" width="1003" height="363" alt=""/></div>
<div id="box_3"><img src="图像/商务网站二级页面_03.gif" width="183" height="293" alt="导航区"/><img src="图像/商务网站二级页面_08_06.gif" width="177" height="229" alt=""/></div>
<div id="box_4"><img src="图像/商务网站二级页面_04.gif" width="820" height="542" alt=""/></div>
<div id="box_5"><img src="图像/商务网站二级页面_06.gif" width="1003" height="31" alt=""/></div>
<div id="box_6"><img src="图像/商务网站二级页面_07.gif" width="1003" height="70" alt=""/></div>
</div>
</body>
</html>
file:///E:/%E5%9B%BE%E7%89%87%E3%80%81%E9%A2%9C%E8%89%B2/%E7%AB%99%E7%82%B9/%E5%B8%83%E5%B1%80.html
本帖子中包含更多资源
您需要
登录
才可以下载或查看,没有帐号?
立即注册
x
点赞
26
哪些同学觉得很赞!
lori棒棒糖
觉得很赞
昵昵妹
觉得很赞
潜意式
觉得很赞
龙猫1212
觉得很赞
大大大表哥
觉得很赞
依仔101
觉得很赞
西卡
觉得很赞
一品数码
觉得很赞
热爱生活热爱家
觉得很赞
我叫大帅比
觉得很赞
举报
使用道具
|
回复
共1个回复 最后回复于 2016-3-9 17:55
xm10421396
积分
7920
0
主题
7920
帖子
7920
积分
金牌会员
金牌会员, 积分 7920, 距离下一级还需 2080 积分
金牌会员, 积分 7920, 距离下一级还需 2080 积分
积分
7920
加为好友
发送消息
访问家园
xm10421396
金牌会员
勤币 8789
学币 0
沙发
发表于 2016-3-9 17:55:57
|
只看该作者
代码写的还算整齐,注意图片边的黑条条可以切掉哦~~
举报
使用道具
回复
支持
反对
返回列表
B
Color
Image
Link
Quote
Code
Smilies
高级模式
您需要登录后才可以回帖
登录
|
立即注册
本版积分规则
发表回复
回帖后跳转到最后一页
快速回复
返回顶部
返回列表