这是一个简单的家乡旅游网页制作, 非常适合html期末大作业

网页效果

#文件目录

代码实现

<!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><link rel="stylesheet" type="text/css" href="css/index.css">
</head><body><div class="page"><div class="banner"><div align="center"><img src="data:images/banner.jpg" /></div></div><div class="daohang"><p><a href="index.html">首页</a></p><p><a href="xihu.html">杭州西湖</a></p><p><a href="xiaochi.html">杭州小吃</a></p><p><a href="fengjing.html">杭州风景</a></p><p><a href="liuyan.html">客户留言</a></p><p><a href="lianxi.html">地理位置</a></p><p><a href="zhanzhang.html">站长信息</a></p></div><div class="content"><div class="zuo"><img src="data:images/zuo1.jpg" /><div class="fangshi"><h1>新闻公告</h1><p> 　　11月19日，杭州西湖风景名胜区管委会（市园林文物局）召开领导干部会议，传达学习贯彻党的十八大精神。西湖风景名胜区（市园文局）党委书记、管委会主任（局长）刘颖传达了十八大精神，并就名胜区（园文局）深入学习贯彻十八大精神作了部署，管委会副主任王宏伟、吕雄伟等党委班子成员、机关全体人员、各基层区（局）管干部参加会议。会议由党委副书记、副主任张鸿斌主持。<br /></p></div></div><div class="you"><div class="jieshao"><h1>杭州介绍</h1><p><img src="data:images/jieshao.jpg" width="218" height="147" style="float:left; margin-right:19px;" />　　杭州市（本地吴语读音（IPA）：愂 tsei）简称杭，中国浙江省省会，副省级城市，浙江省政治、经济、文化、科教中心，长三角地区副中心城市和南翼中心城市，浙江省的金融中心和行政中心，全国重点风景旅游城市和历史文化名城，大陆国际形象最佳城市之一，中国七大古都之一。古时杭州曾称“临安”、“钱塘”、“武林”等。杭州位于浙江省北部，处杭嘉湖平原南缘，拥有约2300年的建城史，是一个典型的山水文化名城。西子湖、钱塘江、千岛湖以及周边丘陵构成了杭州的山水美景。</p><p>自古以来，杭州的经济和文化比较发达，素有“东南第一州”之称。“欲把西湖比西子，淡妆浓抹总相宜”赞美西子湖之美。活跃的多元化经济和发达的文化教育使杭州成为浙江省政治、经济和文化的中心。 </p></div><div class="jieshaoB"><h1>产品展示</h1><p><marquee><img src="data:images/chanpin1.jpg" /><img src="data:images/chanpin2.jpg" /><img src="data:images/chanpin3.jpg" /><img src="data:images/chanpin4.jpg" /><img src="data:images/chanpin5.jpg" /><img src="data:images/chanpin6.jpg" /><img src="data:images/chanpin7.jpg"/><img src="data:images/chanpin8.jpg" /></marquee></p></div></div><div class="clearit"></div></div><div class="foot"><div align="center"></div></div></div>
</body></html>

@charset "utf-8";
/* CSS Document */body,
ul,
ol,
li,
p,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
table,
td,
img,
div {margin: 0;padding: 0;border: 0;
}* {margin: 0;padding: 0;border: 0;
}body {font-family: "宋体";font-size: 12px;color: #000000;line-height: 20px;text-align: left
}td,
th {font-family: "宋体";font-size: 12px;color: #000000;
}a {color: #000000;
}A:link {TEXT-DECORATION: none;
}A:visited {TEXT-DECORATION: none;
}A:hover {TEXT-DECORATION: underline;
}ul,
li {list-style-type: none;
}.clearit {clear: both;
}.page {width: 1003px;margin: 0 auto;
}.daohang {width: 1003px;height: 42px;margin: 0 auto;overflow: hidden;background: url("../images/daohang.jpg") repeat-x;
}.daohang p {width: 140px;line-height: 42px;display: block;float: left;text-align: center;font-size: 14px;font-weight: bold;
}.daohang p a {color: #345479;
}.content {width: 1003px;margin: 0 auto;background: #c2cdda;padding: 20px 0 0;
}.zuo {width: 220px;float: left;margin-left: 10px;display: inline;
}.fangshi {width: 220px;border: 1px solid #ffffff;margin-top: 10px;background: #345479;
}.fangshi h1 {font-size: 14px;padding: 0 10px;font-weight: bold;line-height: 26px;line-height: 26px;border-bottom: 1px solid #ffffff;color: #ffffff;
}.fangshi p {text-align: left;padding: 0 10px;line-height: 24px;color: #ffffff;
}.you {width: 750px;float: left;margin-left: 10px;display: inline;
}.jieshao {width: 748px;border: 1px solid #ffffff;background: #345479;margin-bottom: 10px;
}.jieshao h1 {font-size: 14px;padding: 0 10px;font-weight: bold;line-height: 28px;line-height: 28px;background: #345479;border-bottom: 1px solid #ffffff;color: #ffffff;
}.jieshao p {text-align: left;padding: 10px;line-height: 24px;color: #ffffff;
}.jieshaoB {width: 748px;border: 1px solid #ffffff;background: #345479;margin-bottom: 10px;
}.jieshaoB h1 {font-size: 14px;padding: 0 10px;font-weight: bold;line-height: 28px;line-height: 28px;background: #345479;border-bottom: 1px solid #ffffff;color: #ffffff;
}.jieshaoB p {padding: 10px 0;
}.jieshaoB img {width: 200px;margin-right: 10px;padding: 1px;border: 1px solid #FFFF00;background: #FFFFFF;
}.foot {width: 1003px;margin: 0 auto;padding-top: 50px;background: url("../images/foot.jpg") repeat-x top;padding-bottom: 50px;
}.foot p {text-align: center;line-height: 30px;color: #345479;
}.you h2 {font-size: 14px;font-weight: bold;text-align: center;line-height: 30px;border-bottom: 1px solid #FFFF00;color: #000000;
}.neirong {padding: 20px;line-height: 24px;color: #000000;
}.zhanshi {padding-bottom: 20px;overflow: hidden;
}.zhanshi img {width: 160px;display: block;float: left;margin-left: 10px;display: inline;
}.messageB {width: 600px;padding: 10px 0;overflow: hidden;text-align: left;line-height: 24px;
}.messageB ul li {line-height: 24px;margin-top: 16px;list-style: none;padding: 0;border: 0;
}.messageB ul li span {vertical-align: middle;padding-right: 12px;
}.messageB ul li .message_in {width: 300px;height: 22px;border: 1px solid #999999;vertical-align: middle;line-height: 22px;padding: 0;
}.messageB ul li .message_te {width: 500px;height: 90px;border: 1px solid #999999;vertical-align: middle;line-height: 18px;padding: 0;
}.messageB ul li .message_btn {width: 64px;height: 20px;padding: 0;line-height: 20px;background: url("../images/btn.gif") no-repeat;color: #FFFFFF;font-weight: bold;cursor: hand;
}

HTML+CSS制作家乡旅游网页(杭州旅游网页设计dw制作)相关推荐

HTML5期末大作业——中华传统文化题材学生网页设计成品(6页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 DW静态页面制作 web网页成品
HTML5期末大作业--中华传统文化题材学生网页设计成品(6页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 DW静态页面制作 web网页成品常见 ...
计算机制作贺卡教案,初中计算机教案设计贺卡制作文档.doc
初中计算机教案设计贺卡制作文档初中计算机教案设计:贺卡制作 [教学目标] 根据学生已有认知结构.学习现状及教学大纲的要求,制定如下教学目标: 1．认知目标掌握在Word文档中图片.剪贴画.艺术字 ...
HTML5期末大作业：茶叶文化网站设计——茶叶(10页) HTML+CSS+JavaScript 文化主题 dw茶叶网页设计 web前端大作业 web课程设计网页规划与设计 dw学生网页设计
HTML5期末大作业:茶叶文化网站设计--茶叶(10页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计计算机毕设网页设计源码常见网页设计作业题材有 ...
HTML5期末大作业：茶叶文化网站设计——茶叶(10页) HTML+CSS+JavaScript 文化主题 dw茶叶网页设计 web前端大作业 web课程设计网页规划与设计 dw学生网页设计...
常见网页设计作业题材有个人. 美食. 公司. 学校. 旅游. 电商. 宠物. 电器. 茶叶. 家居. 酒店. 舞蹈. 动漫. 明星. 服装. 体育. 化妆品. 物流. 环保. 书籍. 婚纱. 游 ...
基于HTML家乡旅游主题项目的设计与实现——少林寺(5页)HTML+CSSS
家乡旅游景点网页作业制作网页代码运用了DIV盒子的使用方法,如盒子的嵌套.浮动.margin.border.background等属性的使用,外部大盒子设定居中,内部左中右布局,下方横向浮动排列,大 ...
动漫设计与制作计算机专业,计算机动漫设计与制作专业（毕业论文）.doc
计算机动漫设计与制作专业(毕业论文) 石家庄外国语职业学院毕业设计(论文) 题目: 商业三维漫游动画系.专业: 计算机系.计算机动漫设计班级: 09动漫 2班二O一二年六月十五日毕 ...
web前端期末大作业——HTML+CSS+JavaScript仿王者荣耀游戏网站设计与制作
基于Html+Css+javascript家乡风景乡村网页制作（旅游主题）无锡旅游8页含有轮播图
⛵ 源码获取文末联系 ✈ Web前端开发技术描述网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业 | 游景点介绍 | 旅游风景区 | 家乡介绍 | 等网站的设计与制 ...
基于Html+Css+javascript的网页制作（旅游主题）
Web前端开发技术描述网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业,茶游景点介绍 | 旅游风景区 | 家乡介绍 | 等网站的设计与制作 | HTML期末大学生网页 ...

HTML+CSS制作家乡旅游网页(杭州旅游网页设计dw制作)

网页效果

代码实现

HTML+CSS制作家乡旅游网页(杭州旅游网页设计dw制作)相关推荐

最新文章

热门文章