急求一个html成品网页代码、作业

html-css019

急求一个html成品网页代码、作业,第1张

您好,这样的:

前提:随便你在电脑里那个盘里新建文件夹,命名为:love,然后在这个文件夹里,分别建六个html文件,命名的话就像下面(如果真的不会,就在文件夹里新建六个txt记事本,建好之后分别重命名为以下的名称。)。

首先,主页为:index.html,另外五个网页为:index1.html,index2.html,index3.html,index4.html,index5.html。

网页1代码:文件名:index1.html

<html>

<head></head>

<body>

<p>i love you!</p>

</body>

</html>

网页2代码:文件名:index2.html

<html>

<head></head>

<body>

<p>i hate you!</p>

</body>

</html>

网页3代码:文件名:index3.html

<html>

<head></head>

<body>

<p>i miss you!</p>

</body>

</html>

网页4代码:文件名:index4.html

<html>

<head></head>

<body>

<p>i miss you too!</p>

</body>

</html>

网页5代码:文件名:index5.html

<html>

<head></head>

<body>

<p>i love you too!</p>

</body>

</html>

最终要的是主页代码:index.html,代码如下

<html>

<head></head>

<body>

<img src="XXX.JPG"/>

<a href="index1.html">网页1</a>

<a href="index2.html">网页2</a>

<a href="index3.html">网页3</a>

<a href="index4.html">网页4</a>

<a href="index5.html">网页5</a>

</body>

</html>

已经发送3份。。。。

希望对你有所帮助。。。同时记得采纳我的回答哦。。

如有网页方面的问题,欢迎去我们团或群--专业网站制作

140391953(网站、网页制作QQ群)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

<title>新疆行知书</title>

<link href="20.css" rel="stylesheet" type="text/css">

</head>

<body>

<div id="container">

<div id="banner"><img src="banner.jpg"></div>

<div id="globallink">

<ul>

<li><a href="#">首页</a></li>

<li><a href="#">新疆简介</a></li>

<li><a href="#">风土人情</a></li>

<li><a href="#">吃在新疆</a></li>

<li><a href="#">路线选择</a></li>

<li><a href="#">自助行</a></li>

<li><a href="#">摄影摄像</a></li>

<li><a href="#">游记精选</a></li>

<li><a href="#">资源下载</a></li>

<li><a href="#">雁过留声</a></li>

</ul>

<br>

</div>

<div id="left">

<div id="weather">

<h3><span>天气查询</span></h3>

<ul>

<li>乌鲁木齐   雷阵雨 20℃-31℃</li>

<li>吐鲁番   多云转阴 20℃-28℃</li>

<li>喀什   阵雨转多云 25℃-32℃</li>

<li>库尔勒   阵雨转阴 21℃-28℃</li>

<li>克拉马依   雷阵雨 26℃-30℃</li>

</ul>

<br>

</div>

<div id="today">

<h3><span>今日推荐</span></h3>

<ul>

<li><a href="#"><img src="tuijian1.jpg"></a></li>

<li><a href="#">喀纳斯河</a></li>

<li><a href="#"><img src="tuijian2.jpg"></a></li>

<li><a href="#">布尔津</a></li>

<li><a href="#"><img src="tuijian3.jpg"></a></li>

<li><a href="#">天山之路</a></li>

</ul>

<br>

</div>

</div>

<div id="middle">

<div id="ghost"><a href="#" title="魔鬼城探秘"><img src="ghost.jpg" border="0"></a></div>

<div id="beauty">

<h3><span>美景寻踪</span></h3>

<ul>

<li><a href="#"><img src="beauty1.jpg"></a></li>

<li><a href="#"><img src="beauty2.jpg"></a></li>

<li><a href="#"><img src="beauty3.jpg"></a></li>

<li><a href="#"><img src="beauty4.jpg"></a></li>

</ul>

<br>

</div>

<div id="route">

<h3><span>线路精选</span></h3>

<ul>

<li><a href="#">吐鲁番——库尔勒——库车——塔中——和田——喀什</a></li>

<li><a href="#">乌鲁木齐——天池——克拉马依——乌伦古湖——喀纳斯</a></li>

<li><a href="#">乌鲁木齐——奎屯——乔尔玛——那拉提——巴音布鲁克</a></li>

<li><a href="#">乌鲁木齐——五彩城——将军隔壁——吉木萨尔</a></li>

</ul>

<br>

</div>

</div>

<div id="right">

<div id="map">

<h3><span>新疆风光</span></h3>

<p><a href="#" title="点击看大图"><img src="map1.jpg"></a></p>

<p><a href="#" title="点击看大图"><img src="map2.jpg"></a></p>

</div>

<div id="food">

<h3><span>小吃推荐</span></h3>

<ul>

<li><a href="#">17号抓饭</a></li>

<li><a href="#">大盘鸡</a></li>

<li><a href="#">五一夜市</a></li>

<li><a href="#">水果</a></li>

</ul>

<br>

</div>

<div id="life">

<h3><span>宾馆酒店</span></h3>

<ul>

<li><a href="#">美丽华大饭店</a></li>

<li><a href="#">海德大饭店</a></li>

<li><a href="#">银都大饭店</a></li>

<li><a href="#">鸿福大饭店</a></li>

<li><a href="#">友好大酒店</a></li>

<li><a href="#">棉麻宾馆</a></li>

<li><a href="#">电信宾馆</a></li>

</ul>

<br>

</div>

</div>

<div id="footer">

<p>艾萨克 ©版权所有 <a href="mailto:demo@demo.com">demo@demo.com</a></p>

</div>

</div>

</body>

</html>

css为:

body{

background-color:#2286c6

margin: 0px

padding:0px

text-align:center

font-size:12px

font-family:Arial, Helvetica, sans-serif

}

#container{

position:relative

margin:0px auto 0px auto

width:780px

text-align:left

}

div br{

display:none

}

#globallink{

margin:0pxpadding:0px

}

#globallink ul{

list-style:none

padding:0pxmargin:0px

}

#globallink li{

float:left

text-align:center

width:78px

}

#globallink a{

display:block

padding:9px 6px 11px 6px

background:url(button1.jpg) no-repeat

margin:0px

}

#globallink a:link, #globallink a:visited{

color:#004a87

text-decoration:underline

}

#globallink a:hover{

color:#FFFFFF

text-decoration:underline

background:url(button1_bg.jpg) no-repeat

}

#left{

float:left

width:200px

background-color:#FFFFFF

margin:0px

padding:0px 0px 5px 0px

color:#d8ecff

}

#left div{

background-color:#5ea6eb

margin:0px 5px 0px 5px

}

#weather{

background:url(weather.jpg) no-repeat -5px 0px

margin:0px 5px 0px 5px

background-color:#5ea6eb

}

div#left #weather h3{

font-size:12px

padding:24px 0px 0px 74px

color:#FFFFFF

background:none

margin:0px

}

div#weather ul{

margin:8px 5px 0px 5px

padding:10px 0px 8px 5px

list-style:none

}

#weather ul li{

background:url(icon1.gif) no-repeat 0px 6px

padding:1px 0px 0px 10px

}

#left div h3{

font-size:12px

padding:4px 0px 2px 15px

color:#003973

margin:0px 0px 5px 0px

background:#bbddff url(icon2.gif) no-repeat 5px 7px

}

#today{

padding:0px 0px 10px 0px

}

#today ul{

list-style:none

margin:-5px 0px 0px 0px

padding:0px

}

#today ul li{

text-align:center

}

#today ul li img{

border:1px solid #FFFFFF

margin:8px 0px 0px 0px

}

#today ul li a:link, #today ul li a:visited{

color:#d8ecff

text-decoration:none

}

#today ul li a:hover{

color:#FFFF00

text-decoration:underline

}

#middle{

background-color:#FFFFFF

margin:0px 0px 0px 2px

padding:5px 0px 0px 0px

width:400pxfloat:left

}

#middle div{

margin-left:5px

margin-right:5px

position:relative

}

#middle h3{

margin:0pxpadding:0px

height:41px

}

#middle h3 span{

display:none /* 文字去掉,换成图片 */

}

#beauty{

margin:15px 0px 0px 0px

padding:0px

}

#beauty h3{

background:url(picture_h1.gif) no-repeat

}

#beauty ul, #route ul{

list-style:none

margin:8px 1px 0px 1px

padding:0px

}

#beauty ul li{

float:left

width:97px

text-align:center

}

#beauty ul li img{

border:1px solid #4ab0ff

}

#route{

clear:bothmargin:0px

padding:5px 0px 15px 0px

}

#route h3{

background:url(route_h1.gif) no-repeat

}

#route ul li{

padding:3px 0px 0px 30px

background:url(icon1.gif) no-repeat 20px 7px

}

#route ul li a:link, #route ul li a:visited{

color:#004e8a

text-decoration:none

}

#route ul li a:hover{

color:#000000

text-decoration:underline

}

#right{

float:left

margin:0px 0px 1px 2px

width:176px

background-color:#FFFFFF

color:#d8ecff

}

#right div{

position:relative

margin-left:5px

margin-right:5px

background-color:#5ea6eb

}

#right div h3{

font-size:12px

padding:4px 0px 2px 15px

color:#003973

margin:0px 0px 5px 0px

background:#bbddff url(icon2.gif) no-repeat 5px 7px

}

#map{

margin-top:5px

}

#map p{

text-align:center

margin:0px

padding:2px 0px 5px 0px

}

#map p img{

border:1px solid #FFFFFF

}

#food{

padding-top:10px

}

#food ul, #life ul{

list-style:none

padding:0px 0px 10px 0px

margin:10px 10px 0px 10px

}

#food ul li, #life ul li{

background:url(icon1.gif) no-repeat 3px 9px

padding:3px 0px 3px 12px

border-bottom:1px dashed #EEEEEE

}

#food ul li a:link, #food ul li a:visited, #life ul li a:link, #life ul li a:visited{

color:#d8ecff

text-decoration:none

}

#food ul li a:hover, #life ul li a:hover{

color:#000000

text-decoration:none

}

#life{

padding-top:10px

padding-bottom:5px

margin-bottom:5px

}

#footer{

background-color:#FFFFFF

margin:1px 0px 0px 0px

clear:both

position:relative

padding:1px 0px 1px 0px

}

#footer p{

text-align:center

padding:0px

margin:4px 5px 4px 5px

background-color:#5ea6eb

}

#footer p a{

color:#FFFFFF

text-decoration:none

}