HTML5 final assignment: Catering website design - concise catering website (8 pages) HTML+CSS+JavaScript HTML+CSS assignment: Catering website production_ Food web design

HTML5 final assignment: Catering website design - concise catering website (8 pages) HTML+CSS+JavaScript HTML+CSS assignment: Catering website production_ Food web design

Common web design topics include individuals, food, companies, schools, tourism, e-commerce, pets, electrical appliances, tea, home, hotels, dance, animation, stars, clothing, sports, cosmetics, logistics, environmental protection, books, wedding dress, military, games, festivals, smoking cessation, movies, photography, culture, hometown, flowers, gifts Car, other web design topics, A + level homework, can meet the web design needs of College Students' Web homework, and those who like can be downloaded!

Get more source code

PC pays attention to us

🧡Author home page - more source code

🧡HTML final assignment column

Introduction to works

1. Introduction to web works: HTML final college students' web design homework A + level, you can download what you like, and the article page supports mobile PC responsive layout.

2. Web page work editing: after downloading the work, you can use any HTML editing software (such as DW, HBuilder, Notepad, vscade, Sublime, Webstorm, Notepad + +, etc.) to edit and modify the web page.

3. Web work technology: Div+CSS, mouse over effect, Table, navigation bar effect, banner, form, secondary and tertiary pages, video, audio elements, Flash, logo (source file) is designed, and the knowledge points required for basic final homework are fully covered.

1, Work display






2, File directory

3, 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>
<title>home page</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" rel="stylesheet" href="css/style.css" />
<link type="text/css" rel="stylesheet" href="css/upDateStyle.css" />
<script type="text/javascript">
window.top["BNPage"]=0;
</script>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/md5.js"></script>
<script type="text/javascript" src="js/style.js"></script>
<script type="text/javascript" src="js/updateStyle.js"></script>
<style type="text/css">
body {
	background-color: #FFFFFF;
	background-image: url(images/bg.jpg);
	background-repeat: repeat-x;
}
</style>
</head>
<body>
<div class="mininav" id="topNav">
    <div class="pagetop_notice txt_gray">
            <cite id="login">
                <span class="login">You haven't logged in yet!</span>|<a href="javascript:;" onclick="openMen()">Sign in</a>|<a href="javascript:;" onclick="freeReg()">register</a>|<a href="javascript:;" onclick="help()">help</a>
            </cite>
            <span id="showinfo" style="display:none;">
            	<a href="javascript:;"><em>Java_Swing</em></a>
                <a href="">help</a>|
                <a href="">sign out</a>
            </span>
    </div>
</div>
<div id="BNreturnTopDiv">
  <div class="fwtop">
    <div class="fwtop_cont">    
      <div class="fwtop_logo">
        <div class="top_logo" id="top_logo"> <img src="images/logo.png"  alt="website Logo" title="Logo"> </div>
      </div>
     
      <div class="clear"></div>
      <div class="fwtop_mainNav">
        <div class="siteMainNav fwtop_nav fwnavlink" id="siteMainNav" >
          <ul>
            <li class="open"><a href="">Website home page</a></li>
            <li><a href="17">Announcement notice</a></li>
            <li><a href="118">Dynamic news</a></li>
            <li><a href="117">Praise complaint</a></li>
            <li><a href="119">Recommended delicacies</a></li>
            <li><a href="124">Restaurant introduction</a></li>
            <li><a href="122">Management platform</a></li>
            <li><a href="125">contact us</a></li>
          </ul>
          <div class="clear"></div>
        </div>
      </div>
      <div class="clear fwtop_banner">
        <div class="siteBanner" id="siteBanner"> <img src="images/banner1(1).jpg" width="1000" height="250" alt="" title=""> </div>
      </div>
    </div>
  </div>
  <div class="fwmain">
    <div class="fwmain_cont">
      <div class="fwmain_left edit_putHere" id="edit_putHere_area1" saveTitle="area1">
        <div class="label clear" id="429" rel="429" titles="Article list">
          <div class="label_head">
            <div class="label_title">Dynamic news</div>
            <div class="link_more"><a class="more" href="118" title="Company news">more</a></div>
          </div>
          <div class="label_content">
            <div class="item_list id429">
              <ul class="clearfix" id="articlelist429">
                <li><a title="Warmly congratulate our company on successfully holding an event" href="118/0/53">Warmly congratulate our company on successfully holding an event</a><span class="datetime">2013-12-19</span></li>
                <li><a title="Congratulations on becoming an advanced unit" href="118/0/52">Congratulations on becoming an advanced unit</a><span class="datetime">2013-12-19</span></li>
                <li><a title="Congratulations to the company on becoming a trustworthy unit for consumers" href="118/0/51">Congratulations to the company on becoming a trustworthy unit for consumers</a><span class="datetime">2013-12-19</span></li>
                <li><a title="Congratulations to the company on becoming a trustworthy unit for consumers" href="118/0/44">Congratulations to the company on becoming a trustworthy unit for consumers</a><span class="datetime">2013-12-19</span></li>
                <li><a title="Warm congratulations to the leader of XXX for coming to our company" href="118/0/43">Warm congratulations to the leader of XXX for coming to our company</a><span class="datetime">2013-12-19</span></li>
                <li><a title="Website news test website news test website news test website" href="118/0/eeee">Website news test website news test website news test website</a><span class="datetime">2013-10-18</span></li>
                <li><a title="Website news test website news test website news test website" href="118/0/eeee">Website news test website news test website news test website</a><span class="datetime">2013-10-18</span></li>
              </ul>
            </div>
          </div>
          <div class="label_foot"></div>
        </div>
      </div>
      <div class="fwmain_right edit_putHere" id="edit_putHere_area3" saveTitle="area3">
        <div class="label clear" id="444" rel="444" titles="Recruitment list">
          <div class="label_head">
            <div class="label_title">System announcement</div>
            <div class="link_more"><a class="more" href="124" title="Talent recruitment">more</a></div>
          </div>
          <div class="label_content">
            <div class="item_list id444">
              <ul class="clearfix" id="hrieList444">
                <li><a title="xxxxx" href="#"> the canteen evaluation results were announced in October 2012 < / a > < span class =" datetime "> December 19, 2013 < / span ></li>
                <li><a title="xxxxx" href="#"> the canteen evaluation results were announced in October 2012 < / a > < span class =" datetime "> December 19, 2013 < / span ></li>
                <li><a title="xxxxx" href="#"> the canteen evaluation results were announced in October 2012 < / a > < span class =" datetime "> December 19, 2013 < / span ></li>
                <li><a title="xxxxx" href="#"> the canteen evaluation results were announced in October 2012 < / a > < span class =" datetime "> December 19, 2013 < / span ></li>
                <li><a title="xxxxx" href="#"> the canteen evaluation results were announced in October 2012 < / a > < span class =" datetime "> December 19, 2013 < / span ></li>
                <li><a title="xxxxx" href="#"> the canteen evaluation results were announced in October 2012 < / a > < span class =" datetime "> December 19, 2013 < / span ></li>
                <li><a title="xxxxx" href="#"> the canteen evaluation results were announced in October 2012 < / a > < span class =" datetime "> December 19, 2013 < / span ></li>
              </ul>
            </div>
          </div>
          <div class="label_foot"></div>
        </div>
      </div>
      <div class="clear"></div>
    </div>
    <div class="fwmain_total edit_putHere" id="edit_putHere_area4" saveTitle="area4">
      <div class="label clear" id="434" rel="434" titles="Product list">
        <div class="label_head">
          <div class="label_title">Brand dish recommendation</div>
          <div class="link_more"><a href="117" class="more">more</a></div>
        </div>
        <div class="label_content">
          <div class="pic_list1 pic_list_roll" id="pic_list434">
            <ul class="clearfix" id="prolist434">
              <li> <a title="Product display" href="117/0/37"><img src="images/1.jpg"  style=' width:170px; height:110px;' alt="">
                <p class="title">3 Restaurant No</p>
                </a> </li>
              <li> <a title="Product display" href="117/0/36"><img src="images/2.jpg"  style=' width:170px; height:110px;' alt="">
                <p class="title">3 Restaurant No</p>
                </a> </li>
              <li> <a title="product" href="117/0/34"><img src="images/3.jpg"  style=' width:170px; height:110px;' alt="">
                <p class="title">3 Restaurant No</p>
                </a> </li>
              <li> <a title="product" href="117/0/33"><img src="images/4.jpg"  style=' width:170px; height:110px;' alt="">
                <p class="title">3 Restaurant No</p>
                </a> </li>
              <li> <a title="product" href="117/0/32"><img src="images/5.jpg"  style=' width:170px; height:110px;' alt="">
                <p class="title">3 Restaurant No</p>
                </a> </li>
              <li> <a title="product" href="117/0/31"><img src="images/6.jpg"  style=' width:170px; height:110px;' alt="">
                <p class="title">3 Restaurant No</p>
                </a> </li>
              <li> <a title="product" href="117/0/30"><img src="images/7.jpg"  style=' width:170px; height:110px;' alt="">
                <p class="title">product</p>
                </a> </li>
            </ul>
          </div>
        </div>
        <div class="label_foot"></div>
      </div>
      <script type='text/javascript'>jQuery('#pic_list434').slide({ mainCell:'ul',autoPlay:true,effect:'leftMarquee',interTime:50,vis:6  });</script>
      <div class="label" id="443" rel="443" titles="Links">
        <div class="label_head">
          <div class="label_title">Praise and complaint</div>
        </div>
        <div class="item_list id444">
          <ul class="clearfix" id="hrieList444">
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
            <li><span class="zan">[praise]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 0 < / font >) < span ></li>
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The canteen evaluation results were announced in October 2012</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
            <li><span class="tou">[complaint]</span><a title="xxxxx" href="#">2012 The evaluation results of the canteen were announced in October</a><span class="datetime">2013-12-19</span><span class="response"><font color="#Ff8346 "> [bubble] < / font > (reply < font color =" red "> 1 < / font >) < span ></li>
          </ul>
        </div>
        <div class="clear"></div>
        <div class="label_foot"></div>
      </div>
    </div>
  </div>
  <div class="fwbottom">
    <div class="fwbottom_bottomInfo">
      <div class="siteBottomNav">
        <ul>
          <li><a href="">Website home page</a></li>
          <li><a href="17">About us</a></li>
          <li><a href="118">News Center</a></li>
          <li><a href="117">Product display</a></li>
          <li><a href="119">Online Message </a></li>
          <li><a href="124">Talent recruitment</a></li>
          <li><a href="122">Document download</a></li>
          <li><a href="125">contact us</a></li>
          <div class="clear"></div>
        </ul>
      </div>
      <div class="bottomInfo clear">
        <p align="center"> copyright Copyright(C)2009-2010 XX Co., Ltd</p>
      </div>
    </div>
    <div class="clear"></div>
  </div>
  <!-----------------Right sidebar BEGIN-------------------------->
  
  <div  class=" admin_tool">
    <ul>
      <li><a href="#BNreturnTopDiv">
        <div class="customerFunction top"><b>Back to top</b></div>
        </a></li>
      <li>
        <div class="customerFunction user" onclick="openMen()" sessionMe=""><b>Personal Center</b></div>
      </li>
	  <li>
        <div class="customerFunction buy" onclick="openMen()" sessionMe=""><b>Praise complaint</b></div>
      </li>
      <li>
        <div class="customerFunction home" onclick="SetHome(this,window.location)"><b>Set as home page</b></div>
      </li>
      <li>
        <div class="customerFunction collection" onclick="AddFavorite(window.location,document.title)"><b>Collect this site</b></div>
      </li>
    </ul>
  </div>
  
  <!--QQ--> 
</div>
</body>
</html>


4, Get more source code

PC pays attention to us

5, Learning materials

A complete set of web front-end zero foundation - Introduction to advanced (Video + source code + development software + learning materials + interview questions) (Tutorial)
Suitable for entry-level to advanced children's shoes ~ send 1000 sets of HTML+CSS+JavaScript template websites

6, More source code

HTML5 final assessment homework source code * includes individuals, food, companies, schools, tourism, e-commerce, pets, electrical appliances, tea, home, hotels, dance, animation, stars, clothing, sports, cosmetics, logistics, environmental protection, books, wedding dress, military, games, festivals, smoking cessation, movies, photography, culture, hometown, flowers and gifts Products, cars and others can meet the web design needs of College Students' Web homework. You can download what you like!

Tags: css3 html5 html

Posted on Sun, 28 Nov 2021 20:31:58 -0500 by farkewie