<!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" />
<script src="js/swiper.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<title>老八营养早餐</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.menus.menus1 h1 {
vertical-align: sub;
float: left;
margin-top: 30px;
font-size: 54px;
text-transform: none;
font-family: "华文行楷";
font-weight: lighter;
color: #F89165;
}
.banenr {
height: 80px;
width: auto;
background-color: #eb4537;
}
.banenr .banner-bg h3 {
font-size: 36px;
font-weight: lighter;
float: left;
margin-top: 20px;
color: #f1f1f1;
margin-left: -30px;
}
.banner-bg {
margin: auto;
width: 1100px;
height: 80px;
padding-left: 0px;
}
a {
color: #000;
text-decoration: none;
}
li {
list-style: none;
}
.clear {
clear: both;
}
.menus {
width: 1100px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
height: 100px;
}
.menus ul {
width: 700px;
position: relative;
float: right;
margin-top: 20px;
font-style: italic;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #ff5a5a;
}
.menus li {
float: left;
width: 100px;
height: 40px;
line-height: 40px;
text-align: center;
cursor: pointer;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
font-size: 24px;
}
.menus li:nth-child(2) {
color: #fff;
}
.menus .bg {
width: 100px;
height: 40px;
position:absolute;
left: 0;
top: 0;
z-index: -1;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
background-image: url(images/index/ban.png);
}
.tab {
width: 750px;
height: 500px;
border: 1px solid #000;
margin-top: 20px;
font-size: 40px;
line-height: 500px;
text-align: center;
color: #888;
font-weight: bold;
display: none;
}
.show {
display: block;
}
#footer {
text-align: center;
vertical-align: middle;
height: 150px;
padding-top: 50px;
color: #FFF;
background-color: #333;
}
body {
margin: 0px;
background-color: #f1f1f1;
}
.slider {
background-color: #C99;
height: 620px;
width: 1100px;
margin-right: auto;
margin-left: auto;
margin-top: 0px;
margin-bottom: 0px;
border-radius: 12px;
padding-bottom: 0px;
}
body {
width:auto;
margin: 0px;
padding: 0px;
}
.slider1 {
height: 600px;
width: 1080px;
margin-top: 10px;
margin-right: 10px;
margin-left: 10px;
overflow: hidden;
border-radius: 12px;
}
.welcome-text {
height: 200px;
width: 1100px;
margin-top: 12px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #f1f1f1;
font-size: 48px;
text-align: center;
vertical-align: middle;
padding-top: 40px;
}
.scroll-td-text {
height: 40px;
width: 280px;
text-align: center;
vertical-align: middle;
padding-top: 10px;
font-size: 24px;
}
.introduce {
height: 40px;
width: 1100px;
margin-right: auto;
margin-left: auto;
font-size: 24px;
padding-top: 8px;
border-bottom-width: 2px;
border-left-width: 10px;
border-bottom-style: solid;
border-left-style: solid;
border-bottom-color: #F00;
border-left-color: #9F3;
}
.introduce-content {
height: 500px;
width: 1100px;
margin-right: auto;
margin-left: auto;
background-color: #F0EBDB;
margin-bottom: 5px;
border-radius: 15px;
}
#img-introduce {
background-color: #CC0;
float: left;
height: 480px;
width: 620px;
margin: 10px;
}
#text-introduce {
margin: 10px;
height: 480px;
width: 440px;
float: left;
}
.text-introducce {
height: 100px;
width: 440px;
margin-bottom: 20px;
margin-top: 10px;
}
.scroll {
height: 380px;
width: 1000px;
margin-right: auto;
background-color: #FFF;
position: relative;
overflow: hidden;
margin-top: 20px;
margin-bottom: auto;
margin-left: auto;
}
.ms-ex {
padding: 10px;
height: 440px;
width: 1100px;
border: 1px solid #999;
margin-right: auto;
margin-left: auto;
margin-top: 14px;
margin-bottom: 14px;
}
.text-box {
height: 40px;
width: 150px;
margin-top: 20px;
margin-bottom: 10px;
margin-left: 10px;
float: left;
font-size: 30px;
text-align: center;
vertical-align: middle;
padding-top: 10px;
}
.ms-exhibition p {
height: 36px;
margin-top: 0px;
}
.ms-exhibition {
margin-right: auto;
font-size: 36px;
padding-top: 0px;
text-align: center;
height: 36px;
width: 1000px;
margin-left: auto;
margin-bottom: 0px;
margin-top: 0px;
background-color: #f1f1f1;
}
#text-box1 {
background-color: #FF6;
border-radius: 12px;
}
#text-box3 {
background-color: #F03;
border-radius: 12px;
}
#text4 #text-box4 {
background-color: #6F6;
border-radius: 12px;
}
.swiper-container {
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
}
#text-box2 {
background-color: #09F;
border-radius: 12px;
}
.text-box-right {
float: left;
height: 80px;
width: 250px;
margin-top: 16px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 10px;
font-size: 18px;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
margin-top: 10px;
}
.scroll-in {
height: 300px;
width: 1080px;
margin-top: 40px;
margin-right: auto;
margin-left: auto;
}
.scroll-td {
height: 280px;
width: 280px;
margin-left: 0px;
}
h3 {
font-size: 24px;
line-height: 30px;
font-family: "微软雅黑";
text-indent: 48px;
}
h1 {
line-height: 24px;
font-size: 44px;
}
</style>
<link href="css/swiper.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<embed src="media/bgsound.mp3" autostart="ture" hidden="ture" loop="-1" ShowPositionControls="false">
<div class="menus menus1">
<h1>营养早餐
</h1>
<ul>
<div class="bg"></div>
<li><span><a href="html/index.html" target="blank">首页</a></span></li>
<li><span><a href="html/xz.html" target="blank">稀粥</a></span></li>
<li><span><a href="html/dumplings.html" target="blank">饺子</a></span></li>
<li><span><a href="html/noodle.html" target="blank">面条</a></span></li>
<li><span><a href="html/fired rice.html" target="blank">炒饭</a></span></li>
<li><span><a href="html/drink.html" target="blank">果汁</a></span></li>
<li><span><a href="html/bread.html" target="blank">大饼</a></span></li>
</ul>
<div class="clear"></div>
</div>
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="js/index.js"></script>
<div class="banenr">
<div class="banner-bg">
<h3>简单/美味/健康</h3>
</div></div>
<div class="slider">
<div class="slider1">
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide"><a href="html/dumplings.html" target="new"><img src="images/index/jz.jpg"/></a></div>
<div class="swiper-slide"><a href="html/xz.html" target="new"><img src="images/index/xz.jpg"/></a></div>
<div class="swiper-slide"><a href="html/fired rice.html" target="new"><img src="images/index/cf.jpg"/></a></div
web前端课程设计营养早餐店实现
需积分: 0 100 浏览量
2023-07-21
01:47:24
上传
评论
收藏 94.06MB RAR 举报
web前端课程设计营养早餐店实现 （150个子文件） 
aos.css 25KB swiper.min.css 13KB style.css 4KB banner-style.css 3KB index.css 2KB step.css 874B
index.html 12KB index.html 12KB bread.html 12KB xz.html 9KB dumplings.html 9KB fired rice.html 9KB noodle.html 8KB drink.html 7KB
cf.jpg 802KB xz.jpg 657KB gz.jpg 536KB jz.jpg 535KB mt.jpg 464KB 4.jpg 383KB 8.jpg 381KB mb.jpg 380KB 00.jpg 374KB 5.jpg 355KB 3.jpg 351KB 夏威夷披萨.jpg 331KB 1.jpg 275KB 03.jpg 273KB 01.jpg 272KB 02.jpg 258KB 7.jpg 252KB 2.jpg 248KB 1.jpg 247KB 鸡蛋饼.jpg 238KB 3.jpg 190KB b6.jpg 187KB easy.jpg 174KB h2.jpg 166KB 4.jpg 156KB p9.jpg 156KB b3.jpg 149KB q2.jpg 146KB p1.jpg 146KB j1.jpg 143KB q5.jpg 143KB p8.jpg 142KB q6.jpg 141KB p3.jpg 139KB b2.jpg 138KB 6.jpg 138KB p6.jpg 135KB t5.jpg 132KB p4.jpg 131KB b1.jpg 129KB q7.jpg 129KB q4.jpg 129KB b9.jpg 128KB j3.jpg 126KB p7.jpg 125KB j2.jpg 123KB p5.jpg 123KB h3.jpg 122KB b5.jpg 119KB t1.jpg 118KB b1.jpg 118KB t9.jpg 113KB 06.jpg 112KB 吐司.jpg 112KB 1.jpg 112KB q3.jpg 110KB t2.jpg 110KB p2.jpg 109KB b3.jpg 104KB t3.jpg 104KB t6.jpg 104KB b7.jpg 102KB q1.jpg 101KB 01.jpg 100KB q9.jpg 100KB b4.jpg 98KB 05.jpg 98KB 07.jpg 98KB hxcf.jpg 97KB 7.jpg 93KB 3.jpg 93KB 04.jpg 93KB sjcf.jpg 92KB x3.jpg 91KB h1.jpg 90KB 03.jpg 90KB 6.jpg 90KB 5.jpg 88KB b8.jpg 87KB 2.jpg 87KB q8.jpg 86KB b2.jpg 86KB 2.jpg 86KB 8.jpg 83KB t7.jpg 82KB ymcf.jpg 81KB共 150 条
- 1
- 2
资源评论
