current position:Home>HTML final assignment ~ design and implementation of tourism website based on HTML + CSS + JavaScript (6 pages)

HTML final assignment ~ design and implementation of tourism website based on HTML + CSS + JavaScript (6 pages)

2021-08-22 22:52:39 @. code out the future

HTML Final homework ~HTML+CSS+JavaScript Design and implementation of tourism website -> Green classical tourist resort (6 A page )

Towards the end of the term , You're still working on HTML Web design homework , The teacher's homework requirements are big ?HTML There is no way to start web homework ? The total number of pages required is too much ? No suitable template ? And so on and so forth . The problem you want to solve , In this blog post, you can basically meet your needs ~

original HTML+CSS+JS Page design , web College students web design homework source code , This is a good web page making , Smart picture , Very suitable for beginners to learn to use .

Introduction to works

1. Introduction to web works : Green classical tourist resort , Travel agency service company , Website of scenic spot planning project management company html Template download . contain : Overview of the scenic spot 、 Wenyuan tour 、 Shuya residence 、 news information 、 Contact us etc. 6 A page

2. Web work editing : This work is the subject matter of students' personal home page design , The code is simple student level html+css Layout making , After downloading the works, you can use any HTML Edit software ( for example :DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm All editors are available )

3. The layout of web works : The overall layout of the web page is LOGO、 Navigation 、 Main content layout . There are many layouts of sub pages , Interest content uses picture list layout , The score page inserts a table , Contact us to set the left alignment using the image alignment .

4. Technical aspects of web works : Use CSS Made a background picture of the web page 、 Color change effect of mouse passing and selected navigation 、 Underline, etc . The home page has made a message form , At the same time, it is easy to use JavaScript Made a form to judge ( The form cannot be empty when submitting )

One 、 Demonstration of works

1. home page

 Insert picture description here

2. Overview of the scenic spot

 Insert picture description here

3. Wenyuan tour

 Insert picture description here

4. Contact us

 Insert picture description here

5. news information

 Insert picture description here

Two 、 Code directory

 Insert picture description here

3、 ... and 、 Code implementation

<!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" />
<meta name="renderer" content="webkit"/>
<meta name="force-rendering" content="webkit"/>
<title></title>
<link type="text/css" rel="stylesheet" href="css/style.css" />
<link type="text/css" rel="stylesheet" href="css/animate.css" />
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="js/banner.js"></script>
<script type="text/javascript"> $(document).ready(function () {
      $("ul.nav li").hover(function () {
      $(this).find(".navtwo").toggle(); }) }) </script>
</head>

<body>
<div class="header">
  <ul class="nav">
    <li>
      <a href="index.html"> home page </a>
    </li>
    <li>
      <a href="about.html"> Overview of the scenic spot </a>
    </li>
    <li>
      <a href="piclist.html"> Wenyuan tour </a>
      <div class="navtwo">
        <a href="piclist.html"> Wenyuan tour </a>
        <a href="piclist.html"> Wenyuan tour </a>
        <a href="piclist.html"> Wenyuan tour </a>
      </div>
    </li>
    <li>
      <a href="piclist.html"> Shuya residence </a>
    </li>
    <li>
      <a href="list.html"> news information </a>
      <div class="navtwo">
        <a href="list.html"> Company news </a>
        <a href="list.html"> Industry news </a>
      </div>
    </li>
    <li>
      <a href="about.html"> Contact us </a>
    </li>
  </ul>
</div>
<div class="clear"></div>
<div class="banner">
  <div class="b-img">
      <img src="images/banner1.jpg" width="100%"/>
      <img src="images/banner1.jpg" width="100%" />
  </div>
  <div class="clear"></div>
  <div class="b-list"> </div>
</div>
<div class="clear"></div>
<div class="part1">
  <div class="main">
    <div class="contitbox">
      <p><a href="about.html" class="ccsl"> Overview of the scenic spot </a></p>
      <span class="ccsl">SCENIC OVERVIEW</span>
    </div>
    <div class="conbox">
       Shijiazhuang Feitian yiyoutianxia Travel Agency Co., Ltd. is one of the first batch of new entrepreneurial chain platforms focusing on high-quality B & B .<br> The company was founded in 2017 year 2 month , The registered capital 1000 Ten thousand yuan . Yiyou's mission is to build " Mass innovation 、 Mass Entrepreneurship " New platform , Build a society that is responsible for history and the future 、" Can keep a strong sense of nostalgia " Urbanization village service system ,<br> Contribute to the construction of beautiful villages in the process of urbanization in China .
    </div>
    <div class="morebox">
      <span class="img"></span>
    </div>
  </div>
</div>
<div class="clear"></div>
<div class="part2">
  <div class="contitbox">
    <p><a href="piclist.html" class="ccsl"> Wenyuan tour </a></p>
    <span class="ccsl">COURT TRAVEL</span>
  </div>
  <ul>
    <li>
      <div class="kug"></div>
      <div class="proimg">
        <a href="picdetail.html"><img src="images/1.png" /></a>
      </div>
      <a href="picdetail.html"><p class="ccsl"> Wanzhu Linhai ( One )</p></a>
    </li>
    <li>
      <div class="kug"></div>
      <div class="proimg">
        <a href="picdetail.html"><img src="images/1.png" /></a>
      </div>
      <a href="picdetail.html"><p class="ccsl"> Wanzhu Linhai ( One )</p></a>
    </li>
    <li>
      <div class="kug"></div>
      <div class="proimg">
        <a href="picdetail.html"><img src="images/1.png" /></a>
      </div>
      <a href="picdetail.html"><p class="ccsl"> Wanzhu Linhai ( One )</p></a>
    </li>
  </ul>
</div>
<div class="clear"></div>
<div class="part3">
  <div class="contitbox">
    <p><a href="piclist.html" class="ccsl"> Shuya residence </a></p>
    <span class="ccsl">COURT TRAVEL</span>
  </div>
  <div class="p3con">
    <div class="p3conL">
      <div class="subBox0">
        <ul style="margin-left: 0px; overflow: hidden">
          <li><a href="picdetail.html"><img src="images/2.png" /></a></li>
          <li><a href="picdetail.html"><img src="images/2.png" /></a></li>
          <li><a href="picdetail.html"><img src="images/2.png" /></a></li>
        </ul>
      </div>
    </div>
    <div class="p3conR">
      <img src="images/3.png" />
      <div class="tit ccsl"> customer  |  room  |  Medium  |  Shao </div>
      <div class="sub"> There are all kinds of guest rooms in Taohua forest garden 100 set , The room type is divided into Chinese 、 There are two types of modern , To meet the different needs of guests …</div>
      <div class="updowm">
        <p class="up"> the previous </p>
        <p class="down"> next </p>
      </div>
    </div>
  </div>
  <script type="text/javascript"> $(function () {
      var left = $(".up"); var right = $(".down"); var obj = $(".subBox0 ul"); var w = obj.find("li").innerWidth(); left.click(function () {
      obj.find("li:last").prependTo(obj); obj.css("margin-left", -w); obj.animate({
      "margin-left": 0 }); }); right.click(function () {
      obj.animate({
      "margin-left": -w }, function () {
      obj.find("li:first").appendTo(obj); obj.css("margin-left", "0"); }); }); var moving = setInterval(function () {
      right.click() }, 3000); obj.hover(function () {
      clearInterval(moving); }, function () {
      moving = setInterval(function () {
      right.click() }, 3000); }) }); </script>
   <div class="morebox">
    <span class="img"></span>
   </div>
</div>
<div class="clear"></div>
<div class="part4">
  <div class="main">
    <div class="contitbox">
      <p><a href="list.html" class="ccsl"> news information </a></p>
      <span class="ccsl">NEWS</span>
    </div>
    <ul>
      <li>
        <div class="newl">
          <a href="detail.html" class="ccsl"> Where to play during the summer vacation ? Peach blossom garden is a good summer resort !</a>
          <div class="sub"> Summer vacation is just around the corner , Still hesitating where to take the children ? Hot summer , A restless heart , Carry your packed backpack , Travel around the great rivers and mountains and feel the world , It's better to live in seclusion outside Taoyuan Taohuayuan world boutique . Reduce the noise of the city , Return to the freshness and vulgarity of nature , Let's go on a summer trip .</div>
        </div>
        <div class="newr">
          <span>07.21</span>
          <time>2016</time>
        </div>
        <div class="clear"></div>
      </li>
      <li>
        <div class="newl">
          <a href="detail.html" class="ccsl"> Where to play during the summer vacation ? Peach blossom garden is a good summer resort !</a>
          <div class="sub"> Summer vacation is just around the corner , Still hesitating where to take the children ? Hot summer , A restless heart , Carry your packed backpack , Travel around the great rivers and mountains and feel the world , It's better to live in seclusion outside Taoyuan Taohuayuan world boutique . Reduce the noise of the city , Return to the freshness and vulgarity of nature , Let's go on a summer trip .</div>
        </div>
        <div class="newr">
          <span>07.21</span>
          <time>2016</time>
        </div>
        <div class="clear"></div>
      </li>
      <li>
        <div class="newl">
          <a href="detail.html" class="ccsl"> Where to play during the summer vacation ? Peach blossom garden is a good summer resort !</a>
          <div class="sub"> Summer vacation is just around the corner , Still hesitating where to take the children ? Hot summer , A restless heart , Carry your packed backpack , Travel around the great rivers and mountains and feel the world , It's better to live in seclusion outside Taoyuan Taohuayuan world boutique . Reduce the noise of the city , Return to the freshness and vulgarity of nature , Let's go on a summer trip .</div>
        </div>
        <div class="newr">
          <span>07.21</span>
          <time>2016</time>
        </div>
        <div class="clear"></div>
      </li>
      <li>
        <div class="newl">
          <a href="detail.html" class="ccsl"> Where to play during the summer vacation ? Peach blossom garden is a good summer resort !</a>
          <div class="sub"> Summer vacation is just around the corner , Still hesitating where to take the children ? Hot summer , A restless heart , Carry your packed backpack , Travel around the great rivers and mountains and feel the world , It's better to live in seclusion outside Taoyuan Taohuayuan world boutique . Reduce the noise of the city , Return to the freshness and vulgarity of nature , Let's go on a summer trip .</div>
        </div>
        <div class="newr">
          <span>07.21</span>
          <time>2016</time>
        </div>
        <div class="clear"></div>
      </li>
    </ul>
    <div class="more2">
      <a href="list.html">MORE</a>
    </div>
  </div>
</div>
<div class="clear"></div>
<div class="footer">
  <div class="main">
    <div class="foot">
      <div class="fnav">
        <a href="index.html"> home page </a>
        <a href="about.html"> Overview of the scenic spot </a>
        <a href="piclist.html"> Wenyuan tour </a>
        <a href="piclist.html"> Shuya residence </a>
        <a href="list.html"> news information </a>
        <a href="about.html"> Contact us </a>
      </div>
      <div class="clear"></div>
      <div class="fot">
        <div> Telephone :0311-12345678<br /> mailbox :[email protected]<br /> mobile phone :123 4560 7890<br /> Address : Xiwanzi Town, Yuhua District, Shijiazhuang City, Hebei Province A District 11 Number  </div>
      </div>
    </div>
  </div>
</div>
</body>
</html>




Four 、web Front end entry to advanced ( video + Source code + Information + interview ) a full set of ( course )

web front end Zero basis - Entry to advanced ( video + Source code + Development software + Learning materials + Interview questions ) a full set of ( course )
Suitable for children's shoes from entry to advanced ~ send 1000 set HTML+CSS+JavaScript Template website
 Insert picture description here


5、 ... and 、 The source code for

* ~ Pay attention to me , Like the blog ~ Every day brings you knowledge !

*1. See here, just [ give the thumbs-up + Praise + Collection ] Three even Support me , Yours 「 give the thumbs-up , Praise , Collection 」 It's the driving force of my creation .

* 2. Pay attention to me ~ Take you to study every day : Various front-end plug-ins 、3D Cool effect 、 Pictures show 、 Text effect 、 And the whole station template 、 College graduates HTML Templates 、 Final assignment template 、 etc. ! 「 There are a lot of front end developer , To discuss front end Node knowledge , learn from each other 」!

*3. We can learn from each other about the above technical issues , can Focus on ↓ Male Z Number Get more source code !

 Insert picture description here

6、 ... and 、 more HTML Final assignment work article

1.HTML The students finish their homework at the end of the term ~html+css+javascript Imitation Dingdang movie online website ( The function is all ready )

2.HTML Final student homework ~html+css+javascript Cat's eye movie online website ( The function is all ready )

3.HTML Final student homework (9 set )html+css+javascript Imitation of Jingdong 、 Tmall 、 clothing 、 Major e-commerce templates ( University graduation project )

4.HTML Final homework ~ Pirate king Qiaoba special cartoon student web page setting homework source code (HTML+CSS+JavaScript)

5.HTML Final homework ~ be based on HTML+CSS+JavaScript Design and implementation of tourism website

6.HTML Web design final course assignment ~ Design and implementation of imitation Tencent game official website (HTML+CSS+JavaScript)

7.HTML Final homework ~ Imitation Xiaomi mall web design template (HTML+CSS+JavaScript)

8.HTML Final homework ~ Catering culture student web design homework (HTML+CSS+JavaScript)

9.HTML Student web design homework ~ Catering food hamburger enterprise website 6 Page with carousel (HTML+CSS+JavaScript)

10. university web Basic final assignment ~ Imitation excellent purchase page production (HTML+CSS+JavaScript)

11.HTML Web design and production homework - Make comics, Web Design 6 A page (HTML+CSS+JavaScript)

12.web Front end freshman training ~ Design and implementation of cartoon website (HTML+CSS+JavaScript)

13.web Web design final course assignment ~ Super high imitation hero League LOL Design and implementation of game official website (HTML+CSS+JavaScript)

14.HTML Final homework ~ Hotel website template (HTML+CSS+JavaScript)

15.HTML Student web design homework source code ~ Happy travel website design and Implementation (HTML Final homework )

16.HTML Olympic web page 5 Page culture ~ PE Students' web design homework

17.HTML My hometown Hangzhou web design homework source code (div+css)

18.HTML Web design final course assignment ~ Anime cherry balls 5 Page table div+css Student web design homework source code

19.HTML Student web design homework finished ~ Design and implementation of cosmetics official website (HTML+CSS+JS) common 8 A page

20.HTML College students animation web design homework source code ~ Naruto animation 7 Page with special effects and carousel (HTML+CSS+JavaScript)

21. A complete set of imitation pull hook nets HTML Static web page template ( contain 38 Independent HTML)

22.HTML Final assignment course design big assignment ~ Environmental protection student web design homework source code (HTML+CSS)

23 Web Finished web homework for college students ~ Design and implementation of gourmet catering website (HTML+CSS+JavaScript)

24.HTML Final homework ~ Design and implementation of green agricultural products and food website (HTML+CSS+JavaScript)

25.HTML Final homework ~ Design and implementation of website template of flower shop flower Mall (HTML+CSS+JavaScript)

26.HTML Final homework ~ College students travel official website design homework finished product (HTML+CSS+JavaScript)

27.HTML Final homework ~ Maldives tourism web design finished product

28.HTML Final homework ~ my hometown ( Luoyang City ) Tourism web design finished product (HTML+CSS+JavaScript)

29.HTML Final homework ~ Fengyang tourism website design finished product (HTML+CSS+JavaScript)

30.HTML Final homework ~ Fengyang smart tourism official flagship store ( my hometown )(HTML+CSS+JavaScript)

31.HTML Final homework course design ~ Imitation Yin Yang division game official website home page html Templates (HTML+CSS)

32.HTML Final homework course design animation theme html5 Webpage ~ Chien animation home page html Templates (HTML+CSS)

33.HTML Final homework course design ~ Animation game official website 10 A page (HTML+CSS+JavaScript)

34. Personal design web Front end operation ~ Responsive game website source code (HTML+CSS+Bootstrap)

35.HTML Final homework ~ Personal image resources web page design, a total of 5 A page (HTML+CSS+JavaScript)

36.web Course design, web page planning and design ~ The online novel reading page has a total of 6 A page (HTML+CSS+JavaScript+Bootstrap)

37.HTML Final homework ~ Fresh handmade soap website display 4 A page (HTML+CSS+JavaScript+Bootstrap)

38. Student HTML Personal web work ~ The cake and dessert shop has a total of 11 A page (HTML+CSS+JavaScript)

39.HTML Final homework ~ Chess and card game static website (6 A page ) HTML+CSS+JavaScript

40.HTML Final homework ~ Fast fresh food station html Webpage ( common 6 A page )HTML+CSS+JavaScript

41.HTML Web design homework ~ Imitation Xiaomi mall website is pure HTML Template source code (8 A page )(HTML+CSS)

42.HTML Web design class homework ~ The home page of imitation Fanke clothing mall is pure HTML Template source code (HTML+CSS+JS)

43.HTML Web design homework ~ Imitation mushroom Street Mall website source code (HTML+CSS+JS)

44.web Course design, web page planning and design ~ Fashion clothing shopping mall template html Source code (HTML+CSS+JS)

45.web Web design final course assignment ~ Pink clothing shopping mall page template (HTML+CSS+JS)

46.HTML Final homework ~ Holiday gift mall website html Templates 11 A page (HTML+CSS+JavaScript)

47. Student HTML Personal web work ~ Personal home page blog web page design and production (6 A page )

48.HTML Final homework ~ Student personal blog static page template 6 A page (HTML+CSS+JavaScript)

49.HTML Final homework ~web Front end development personal blog HTML Whole station formwork

50. Final students HTML Personal web work Blue yiqingxuan responsive personal blog template source code (6 A page )bootstrap Responsive blog site template html

51.HTML Final homework ~ Simple programmer personal blog website template source code (7 A page )(HTML+CSS)

52.HTML Final homework ~ Simple front page of personal blog website HTML Templates 7 A page (html+css+js)

53.HTML+CSS College Students' personal website assignment template ~ black html5 Personal blog website template whole station download (5 A page )

54. use HTML+CSS Make a beautiful and simple personal web page ~ Personal album introduction personal home page template (6 A page ) Student HTML Personal web work

55.HTML Final homework ~ Imitation Sina Weibo personal home page html Website template 4 A page (HTML+CSS+JavaScript)

56.HTML Web design and production homework (div+css)~ Environmental protection (5 A page )

57.HTML Web design and production homework - Green environmental protection HTML5 Website template (4 A page )

58.web Front end final assignment html+css+javascript Examples of global private customized tourism Web Design (6 A page )

59.web Front end final assignment html+css+javascript College sports web page design template code Campus basketball web homework finished product

60.HTML Static web job - Food and beverage website 8 A page (HTML+CSS+JavaScript)

61.HTML Static web job - Online flower shop 4 A page (HTML+CSS+JS)

62. Personal design web Front end operation ~ Hotel Web Design ( Ruihao International Hotel )(HTML5+CSS3+Bootstrap)

63. Freshman training website making homework ~ Agricultural products web page 2 A page (div+css)

7、 ... and 、 More confession source code

100 paragraph html+css+JavaScript Declare the source code demonstration address

copyright notice
author[@. code out the future],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2021/08/20210822225237885c.html

Random recommended