web前端网页课程设计大作业 html+css+javascript天津旅游(11页) dw静态旅游网页设计实例企业网站制作

IT-司马青衫

于 2025-04-20 14:11:45 发布

阅读量984

点赞数 31

CC 4.0 BY-SA版权

文章标签：前端课程设计 html

本文链接：https://blog.youkuaiyun.com/bigwhiteshark/article/details/147365120

👨‍🎓学生HTML静态网页基础水平制作👩‍🎓，页面排版干净简洁。使用HTML+CSS页面布局设计,web大学生网页设计作业源码，这是一个不错的旅游网页制作，画面精明，排版整洁，内容丰富，主题鲜明，非常适合初学者学习使用, 这个实例比较全面，有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计。

网页题目👨‍🎓

🚀 旅游景点介绍、旅游风景区、家乡介绍、等网站的设计与制作。

网页描述✍️

旅游景点介绍、旅游风景区是一个介绍简介、行政区划、地理环境、自然环境、教育事业、体育事业、旅游景点、城市荣誉等等。网站集中主要展示了的地方风土人情，并通过访客留言，增加游客的互动体验。同时，地方旅游网站里的每一个网页都采用了统一的设计风格，以加强城市整体面貌统一的宣传效果。最重要的是做出旅游网站独特的风格，更能吸引浏览者的眼球。

网站效果🌐

网站设计制作的重点是对网页整体设计的布局和对网页整体内容的选题。
网站设计方面：计划实现简洁大气的网页设计效果。
网站功能方面：计划实现各个页面之间的链接跳转功能、鼠标悬停在文字上的变色功能、简单的首页动态图片切换功能、简单的表单提交功能。

在这里插入图片描述

HTML结构代码🧱


<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>天津旅游</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="cleaner"></div>
<div id="container">
  <div class="dm"> 
    
    <div id="yc-mod-slider">
      <div class="wrapper">
        <div id="slideshow" class="box_skitter fn-clear">
          <ul>
            <li> <img class="cubeRandom" src="images/dm1.jpg" /></li>
            <li> <img   class="cubeRandom" src="images/dm2.jpg" /></li>
            <li> <img   class="cubeRandom" src="images/dm3.jpg" /></li>
          </ul>
        </div>
         
      </div>
    </div>
     
  </div>
  <div class=" clear"></div>
  <div class="index_main">
    <div class="index_list">
      <ul>
        <li> <a href="index.html">首页</a> </li>
        <li> <a href="page1.html">天津摩天轮</a> </li>
        <li> <a href="page2.html">五大道</a> </li>
        <li> <a href="page3.html">古文化街</a> </li>
        <li> <a href="page4.html">海河意式</a> </li>
        <li> <a href="page5.html">瓷房子</a> </li>
        <li> <a href="page6.html">欢乐谷</a> </li>
        <li> <a href="page7.html">自然博物馆 </a> </li>
        <li> <a href="page8.html">西开教堂</a> </li>
        <li> <a href="page9.html">霍元甲故居</a> </li>
        <li> <a href="page10.html">主题公园</a> </li>
      </ul>
    </div>
    <div class="index_mainr">
      <h1>欢迎光临--天津旅游网
      </h1>
      <p>天津，简称津，中华人民共和国直辖市、xx中心城市、超大城市、环渤海地区经济中心、首批沿海开放城市、综合交通枢纽，全国先进制造研发基地、北方国际航运核心区、金融创新运营示范区、改革开放先行区。 [1-3] <br />
        天津自古因漕运而兴起，明永乐二年十一月二十一日（1404年12月23日）正式筑城，是xx古代唯一有确切建城时间记录的城市。历经600多年，造就了天津中西合璧、古今兼容的独特城市风貌。<br />
      天津位于华北平原海河五大支流汇流处，东临渤海，北依燕山，海河在城中蜿蜒而过，海河是天津的母亲河。天津滨海新区被誉为&quot;xx经济第三增长极&quot;。天津是夏季达沃斯论坛常驻举办城市。</p>   
      <p></p>
      <div class="index_xz">
        <ul>
          <li><a href="page1.html"> <img src="images/r1.jpg" /></a> <a href="page1.html">天津摩天轮</a></li>
          <li><a href="page2.html"> <img src="images/r2.jpg" /> </a><a href="page2.html">五大道</a></li>
          <li><a href="page3.html"> <img src="images/r3.jpg" /> </a><a href="page3.html">古文化街 </a></li>
          <li><a href="page4.html"> <img src="images/r4.jpg" /> </a> <a href="page4.html">海河意式风情区</a></li>
          <li><a href="page5.html"> <img src="images/r5.jpg" /></a> <a href="page5.html">瓷房子</a>
          </li><li><a href="page6.html"> <img src="images/r6.jpg" /> </a><a href="page6.html">欢乐谷</a></li>
          <li><a href="page7.html"> <img src="images/r7.jpg" /> </a> <a href="page7.html">自然博物馆 </a> </li>
          <li><a href="page8.html"> <img src="images/r8.jpg" /> </a><a href="page8.html">西开教堂</a> </li>
          <li><a href="page9.html"> <img src="images/r9.jpg" /></a><a href="page9.html">霍元甲故居</a></li>
          <li><a href="page10.html"> <img src="images/r10.jpg" /> </a><a href="page10.html">主题公园</a></li>
        </ul>
        <div class="cleaner"></div>
      </div>
      <div class=" clear"></div>
    </div>
    <div class=" clear"></div>
  </div>
  <div class="share">
    <ul>
      
    </ul>
    <div class="cleaner"></div>
  </div>
  <div id="footer"> Copyright © 天津旅游网</div>
  <div class=" clear"></div>
</div>

</body> 
</html>