SlideShare a Scribd company logo
‫بحث‬ ‫مشروع‬
‫الويب‬ ‫برمجيات‬
‫(عن‬daily juice)
‫الغامدي‬ ‫احمد‬ ‫إبراهيم‬ ‫تقديم‬
439231483
!<DOCTYPE html>
<html>
<head>
<meta charset="utf-8>"
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no>"
<meta http-equiv="x-ua-compatible" content="ie=edge>"
<link href="css/bootstrap.css" rel="stylesheet>/ "
<link href="css/style.css" rel="stylesheet>/ "
<title>Daily Juice</title>
/<head>
<body>
!<--Navigation Bar start... This is the header of the main page-->
<nav class="navbar navbar-light bg-faded navbar-fixed-top>"
<button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse" data-target="#CollapseNavbar" aria-
controls="CollapseNavbar" aria-expanded="false" aria-label="Toggle Navigation">&#9776;</button>
<div class="collapse navbar-toggleable-xs" id="CollapseNavbar>"
!<--this is the logo of the website in the top nav-->
<a class="navbar-brand" href="#"><img src="img/logo1.jpg" alt="Event logo" height="40"></a>
<div class="collapse navbar-toggleable-xs>"
<ul class="nav navbar-nav pull-lg-right>"
!<--the index paage is always active means that its highlighted-->
<li class="nav-item active>"
<a class="nav-link" href="index.html">Home</a>
/<li>
<li class="nav-item>"
<a class="nav-link" href="menu.html">Menu</a>
/<li>
<li class="nav-item>"
<a class="nav-link" href="about.html">About</a>
/<li>
<li class="nav-item>"
<a class="nav-link" href="contact.html">Contact</a>
/<li>
/<ul>
/<div>
/<nav>
!<--Navigation Bar End-->
<div class="container-fluid"><br><br><br>
/<div>
<div class="container-fluid>"
<img src="img/main.png" alt="Event logo" width="100%>"
/<div>
<br><br>
!<--Title Start... the introdution-->
<section>
<div class="container>"
<h1 class="text-lg-center display-4">juice, smoothies <small class="text-muted">and more!</small></h1>
<p class="text-lg-center">Daily Juice is on a mission to create great tasting and nutritious juices, smoothies, bowls and bites. our
menu is full of fresh offerings that are equally craveable and guilt-free. </p>
<p class="text-lg-center>"
we take a lot of pride in serving products that are high in nutritional value. our juices are made fresh to order, and our sm oothies are
made with frozen fruit instead of ice – which is commonly used by other companies as a filler ingredient.
we want your drinks to be full of nourishment, not fillers. best of all, we have created a juice bar experience built
on convenience. we believe healthy food should be as accessible as fast food.
so beyond our made-to-order menu, all of our stores are stocked with grab-and-go options that are perfect for a
quick, healthy bite or sip.
/<p>
<p class="text-lg-center">whether you are a juicing novice or you're a smoothie pro, we've crafted unique recipes that are packed with
nutrition, taste amazing and are a quick way to fuel up on healthy ingredients!</p>
/<div>
<br><br><hr>
!<--the three options-->
<div class="container>"
<div class="col-md-4>"
<div class="figure>"
<a href="menu.html" ><img class="figure-img img-fluid img-rounded" src="img/1.jpg" alt="Concert Category>"
<div class="centered"><h1>Menu</h1></div>
/<a>
/<div>
/<div>
<div class="col-md-4>"
<div class="figure>"
<a href="about.html> "
<img class="figure-img img-fluid img-rounded" src="img/2.jpg" alt="Book Fair Category>"
<div class="centered"><h1>About us</h1></div>
/<a>
/<div>
/<div>
<div class="col-md-4>"
<div class="figure>"
<a href="contact.html> "
<img class="figure-img img-fluid img-rounded" src="img/4.jpg" alt="Football Category>"
<div class="centered"><h1>Contacts </h1></div>
/<a>
/<div>
/<div>
/<section>
!<--End-->
<br><hr>
!<--section2 Start-->
<section>
<div class="last-review backgreen>"
<div class="container>"
<div class="col-md-8>"
<div>
<h2 class="display-4"><img class="figure-img img-fluid img-rounded" src="img/55.png"> </h2>
<blockquote class="blockquote>"
<p>
we take a lot of pride in using ingredients that are high in quality, responsibly sourced, nutrient-rich, and plant-based to
help power you through your daily routine.
<p>
we never use any added fillers, syrups, sugars or artificial ingredients of any kind and we make all of our menu items
fresh for you every single day.
/<p>
/<blockquote>
/<div>
/<div>
/<div>
/<div>
/<section>
!<--section2 End-->
<br>
!<--Footer Area Start-->
<footer>
<div class="col-md-6 text-lg-center>"
<p class="footer-link">Copyright © 2019 <a href="#" class="text-info">Daily Juice</a></p>
/<div>
/<div>
/<footer>
!<--Footer Area End-->
/<body>
/<html>
!<DOCTYPE html>
<html lang="en>"
<head>
<meta charset="UTF-8>"
<link href="css/bootstrap.css" rel="stylesheet>/ "
<link href="css/style.css" rel="stylesheet>/ "
<link href="css/mycarousel.css" rel="stylesheet>/ "
<title>Menu|DailyJuice</title>
/<head>
<body>
!<--Responsive NavbarDesign-->
<nav class="navbar navbar-light bg-faded>"
<button class="navbar-toggler hidden-sm-up"type="button"data-toggle="collapse" data-target="#CollapseNavbar" aria-
controls="CollapseNavbar"aria-expanded="false" aria-label="Toggle Navigation">&#9776;</button>
<div class="collapse navbar-toggleable-xs" id="CollapseNavbar>"
<a class="navbar-brand" href="#"><imgsrc="img/logo1.jpg"alt="Event logo"height="40"></a>
<ul class="nav navbar-navpull-md-right>"
<li class="nav-item"><a href="index.html" class="nav-link">Home</a></li>
<li class="nav-itemactive"><ahref="menu.html" class="nav-link">Menu</a></li>
<li class="nav-item"><a href="about.html" class="nav-link">About</a></li>
<li class="nav-item"><a href="contact.html" class="nav-link">Contact</a></li>
/<ul>
/<div>
/<nav>
!<--juice Cover Design-->
<section class=" text-xs-center>"
<div class="container>"
<div class="col-md-4>"
<div class="figure>"
<div> <img class="figure-imgimg-fluidimg-rounded" src="img/juice.jpg" alt>""=
/<div>
/<div>
/<div>
<div class="col-md-4>"
<div class="figure>"
<imgclass="figure-imgimg-fluidimg-rounded" src="img/juice2.jpg" alt>" "=
/<div>
/<div>
<div class="col-md-4>"
<div class="figure>"
<div> <img class="figure-imgimg-fluidimg-rounded" src="img/juice.jpg" alt>""=
/<div>
/<div>
/<div>
/<div>
/<section>
!<--juice List-->
<section>
<div class="container>"
<div class="col-md-3>"
<div class="card>"
<div class="card-blocktext-lg-center>"
<h4 class="card-title">GINGER GREENS</h4>
<h6 class="card-subtitle text-muted">200| 300 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">ginger • apple • kale • spinach• cucumber • parsley• lemon</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">WE GOT THE BEET™</h4>
<h6 class="card-subtitle text-muted">160 | 250cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">beet • carrot • apple • ginger • lemon</p>
/<div>
/<div>
/<div>
<div class="col-md-3">
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">ORANGE YOU GLAD™</h4>
<h6 class="card-subtitle text-muted">180| 270 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">carrot • apple • pineapple• mint • ginger • lemon</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-blocktext-lg-center>"
<h4 class="card-title">SUPER GREENS</h4>
<h6 class="card-subtitle text-muted">70 | 100cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">wheatgrass • celery• kale • spinach • cucumber • parsley • lemon</p>
/<div>
/<div>
/<div>
/<div>
/<section>
<section>
<div class="container>"
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">PINEAPPLEGREENS</h4>
<h6 class="card-subtitle text-muted">100 | 180cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">cucumber• pineapple • mint • kale • spinach• parsley • lemon</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">SWEET GREENS</h4>
<h6 class="card-subtitle text-muted">240| 360 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">apple • kale • spinach• cucumber • parsley• lemon</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-blocktext-lg-center>"
<h4 class="card-title">MEAN GREENS</h4>
<h6 class="card-subtitle text-muted">70 | 110 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">jalapeño • celery • kale • spinach• cucumber • parsley• lemon</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">FRESH GREENS</h4>
<h6 class="card-subtitle text-muted">200 | 300cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">celery• kale • spinach • cucumber • parsley • lemon</p>
/<div>
/<div>
/<div>
/<div>
/<section>
<div class="container"> <hr>
<button class="btnbtn-info-outlinepull-lg-right">OrderNow</button> </div>
<br> <br>
!<--smooothies section-------------------------------------------------------------------------------------->
<hr><br></br>
<section class=" text-xs-center>"
<div class="container>"
<div class="col-md-4>"
<div class="figure>"
<div> <imgclass="figure-imgimg-fluidimg-rounded" src="img/smo1.png"alt>""=
/<div>
/<div>
/<div>
<div class="col-md-4>"
<div class="figure>"
<imgclass="figure-imgimg-fluidimg-rounded" src="img/smoothie2.jpg" alt>" "=
/<div>
/<div>
<div class="col-md-4>"
<div class="figure>"
<div> <imgclass="figure-imgimg-fluidimg-rounded" src="img/smo1.png"alt>""=
/<div>
/<div>
/<div>
/<div>
/<section>
!<--juice List-->
<section>
<div class="container>"
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">THE DOC</h4>
<h6 class="card-subtitle text-muted">380 | 490cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">kale • spinach • probiotics • spirulina • ginger • mint • blueberries • strawberries • banana
• juiced apple</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">COCOA BANANA™</h4>
<h6 class="card-subtitle text-muted">160| 250 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">rawcacao powder • peanut butter • spinach• pinkhimalayansea salt • plant-based
proteinpowder • banana • coconut milk</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-blocktext-lg-center>"
<h4 class="card-title">MATCHA GREEN</h4>
<h6 class="card-subtitle text-muted">270| 450 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">matchagreen tea • macapowder • cashews • spinach• mango• banana • lemon•
pink himalayansea salt • almondmilk</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">COFFEE JANET™</h4>
<h6 class="card-subtitle text-muted">480 | 730cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">rawcacao powder • coffee • hempseeds • almondbutter • banana • plant-based
proteinpowder • himalayanpinksalt • almondmilk</p>
/<div>
/<div>
/<div>
/<div>
/<section>
<section>
<div class="container>"
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">BERRY GOOD</h4>
<h6 class="card-subtitle text-muted">320| 440 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">blueberries • banana • cashews • lemon • coconut milk</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-blocktext-lg-center>"
<h4 class="card-title">PB&J</h4>
<h6 class="card-subtitle text-muted">570| 660 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">peanut butter • banana • strawberries • flax seedoil • applejuice</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">GREEN SMOOTHIE</h4>
<h6 class="card-subtitle text-muted">270 | 360 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">kale • spinach • pineapple • banana• lemon• coconut milk• apple
juice</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">MINT TO BE</h4>
<h6 class="card-subtitle text-muted">240 | 350cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">mint • mango • pineapple • coconut milk• applejuice</p>
/<div>
/<div>
/<div>
/<div>
</section>
<div class="container"> <hr>
<button class="btn btn-info-outline pull-lg-right">Order Now</button> </div>
<br> <br>
!<--smooothies bowl section-------------------------------------------------------------------------------------->
<hr><br></br>
<section class=" text-xs-center>"
<div class="container>"
<div class="col-md-4>"
<div class="figure>"
<div> <img class="figure-imgimg-fluidimg-rounded" src="img/bowl55.png" alt>""=
/<div>
/<div>
/<div>
<div class="col-md-4>"
<div class="figure>"
<imgclass="figure-imgimg-fluidimg-rounded" src="img/smobowl.PNG" alt>" "=
/<div>
/<div>
<div class="col-md-4>"
<div class="figure>"
<div> <img class="figure-imgimg-fluidimg-rounded" src="img/bowl55.png" alt>""=
/<div>
/<div>
/<div>
/<div>
/<section>
!<--menustarts----------->
!<--juice List------------------------------------------>
<section>
<div class="container>"
<div class="col-md-3>"
<div class="card>"
<div class="card-blocktext-lg-center>"
<h4 class="card-title">AÇAÍBOWL</h4>
<h6 class="card-subtitle text-muted">660cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">apple juice • açaí • blueberries • avocado• banana • toppedwith granola • banana•
strawberries • almondbutter • hemp seeds • local honey</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">COCOABANANA™</h4>
<h6 class="card-subtitle text-muted">540 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">coconut water• mango• banana • spirulina • toppedwith granola • banana • blueberries •
peanut butter • coconut flakes • bee pollen• local honey</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-block text-lg-center>"
<h4 class="card-title">DRAGON FRUIT BOWL</h4>
<h6 class="card-subtitle text-muted">460cal </h6>
/<div>
<div class="card-block>"
<p class="card-text">apple juice • dragon fruit • mango• toppedwith granola • banana • strawberries • local
honey</p>
/<div>
/<div>
/<div>
<div class="col-md-3>"
<div class="card>"
<div class="card-blocktext-lg-center>"
<h4 class="card-title">CHOCOLATEBOWL</h4>
<h6 class="card-subtitle text-muted">650 cal</h6>
/<div>
<div class="card-block>"
<p class="card-text">almondmilk • avocado• banana • hempseeds • rawcacao • toppedwith granola •
banana • strawberries • cacao nibs • almondbutter • hemp seeds • cacao nibs • local honey</p>
/<div>/<div>/<div>/<div>
/<section>
<div class="container"> <hr>
<button class="btnbtn-info-outline pull-lg-right">Order Now</button> </div>
<br><br>
!<--Endof the menu------------------------------------------------------->
<nav class="text-lg-center"aria-label="Page navigation Try>"
<ul class="pagination>"
<li class="page-item">
<a class="page-link"href="#"aria-label="Prev>"
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Prev</span>
/<a>
/<li>
<li class="page-item"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item"><a class="page-link" href="#">4</a></li>
<li class="page-item"><a class="page-link" href="#">5</a></li>
<li class="page-item>"
<a class="page-link"href="#"aria-label="Next>"
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">Next</span>
/<a>
/<li>
/<ul>
/<nav>
!<--FooterArea Start-->
!<--Footer Area Start-->
<footer>
<div class="col-md-6text-lg-center>"
<p class="footer-link">Copyright ©2019<a href="#" class="text-info">DailyJuice</a></p>
/<div>
/<div>
/<footer>
!<--Footer Area End-->
/<body>
/<html>
!<DOCTYPE html>
<html>
<head>
<meta charset="utf-8>"
<meta name="viewport"content="width=device-width, initial-scale=1, shrink-to-fit=no>"
<meta http-equiv="x-ua-compatible" content="ie=edge>"
<link href="css/bootstrap.css" rel="stylesheet>/ "
<link href="css/style.css" rel="stylesheet>/ "
<link href="css/mycarousel.css" rel="stylesheet>/ "
<title>About|DailyJuice</title>
/<head>
<body>
!<--NavigationBar start...This is theheaderof the main page-->
<nav class="navbarnavbar-light bg-fadednavbar-fixed-top>"
<button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse"data-target="#CollapseNavbar"aria-
controls="CollapseNavbar"aria-expanded="false" aria-label="Toggle Navigation">&#9776;</button>
<div class="collapse navbar-toggleable-xs" id="CollapseNavbar>"
!<--this is thelogo ofthe website in the topnav-->
<a class="navbar-brand"href="#"><imgsrc="img/logo1.jpg" alt="Event logo" height="40"></a>
<div class="collapse navbar-toggleable-xs>"
<ul class="nav navbar-navpull-lg-right>"
<li class="nav-item>"
<a class="nav-link"href="index.html">Home</a>
/<li>
<li class="nav-item>"
<a class="nav-link"href="menu.html">Menu</a>
/<li>
<li class="nav-itemactive>"
<a class="nav-link"href="about.html">About</a>
/<li>
<li class="nav-item>"
<a class="nav-link"href="contact.html">Contact</a>
/<li>
/<ul>
/<div>
/<nav>
!<--NavigationBar End-->
<div class="container-fluid"><br><br>
/<div>
<div class="container-fluid>"
<img src="img/about.jpg"alt="Event logo"width="100%" height="550px>"
/<div>
<br><br>
<!--Title Start... about-->
<section>
<div class="container>"
<h1 class="text-lg-centerdisplay-4">About </h1>
<hr>
<p class="text-lg-center">DailyJuice is plant-based, gluten-free, andorganic when possible.
We always use 100% whole fruits andvegetables from scratch.Nothingprocessed, nothingyucky.
Simply said, we are an “I-want-to-eat-healthy-and-feel-great” type of place.
Whether youwant a quick smoothieon thego, a growler of freshjuice for your fridge or a full sit -down
delicious meal, we are delightedto offergreat-tasting,
super-nutritious juices, smoothies,andfoods. We have fun withwhat we do andlook forwardtobeingof
service to youin anycapacity. Have fun,be amazing!</p>
/<div>
<br><br><hr>
<!--Footer Area Start-->
<footer>
<div class="col-md-6text-lg-center>"
<p class="footer-link">Copyright ©2019<a href="#" class="text-info">DailyJuice</a></p>
/<div>
/<div>
/<footer>
!<--Footer Area End-->
/<body>
/<html>
!<DOCTYPE html>
<html lang="en>"
<head>
<meta charset="UTF-8>"
<link href="css/bootstrap.css" rel="stylesheet>/ "
<link href="css/style.css" rel="stylesheet>/ "
<link href="css/mycarousel.css" rel="stylesheet>/ "
<title>Contact|DailyJuice</title>
/<head>
<body>
!<--Responsive NavbarDesign-->
<nav class="navbar navbar-light bg-faded>"
<button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse"data-target="#CollapseNavbar"aria-
controls="CollapseNavbar"aria-expanded="false" aria-label="Toggle Navigation">&#9776;</button>
<div class="collapse navbar-toggleable-xs" id="CollapseNavbar>"
<a class="navbar-brand" href="#"><imgsrc="img/logo1.jpg" alt="Event logo"height="40"></a>
<ul class="nav navbar-navpull-md-right>"
<li class="nav-item"><ahref="index.html"class="nav-link">Home</a></li>
<li class="nav-item"><a href="menu.html" class="nav-link">Menu</a></li>
<li class="nav-item"><ahref="about.html"class="nav-link">About</a></li>
<li class="nav-itemactive"><a href="contact.html"class="nav-link">Contact</a></li>
/<ul>
/<div>
/<nav>
<div class="jumbotron event-detail-lg>"
<h1 class="display-4text-lg-centertext-uppercase">Contact Us </h1>
/<div>
<section class="container>"
<div class="col-md-6>"
<iframe width="560"height="315"src="https://www.youtube.com/embed/GFmTa2FuEP4"frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
/<div>
<div class="col-md-6>"
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d9755.10085875133!2d4.848296769775384!3d5
2.320081300000034!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c5e1d8d2feb101%3A0x6c98e492d59acdc3
!2sRunnersworld+Amsterdamse+Bos!5e0!3m2!1sen!2str!4v1470328369055"width="450"
height="315"frameborder="0"style="border:0; margin-left:30px" allowfullscreen></iframe>
/<div>
/<section>
!<--comment section-->
<br><br>
<section class="container>"
<hr>
<h4 class="display-2text-md-center">Write your comment !</h4>
<div class="col-md-8>"
<form>
<fieldset class="form-group>"
<input type="text"class="form-control"id="Name"placeholder="Name"></input>
/<fieldset>
<fieldset class="form-group>"
<input type="email"class="form-control" id="Email"placeholder="Email"></input>
/<fieldset>
<fieldset class="form-group>"
<textarearows="3"class="form-control" placeholder="Message"></textarea>
/<fieldset>
<button class="btn btn-success-outline pull-lg-right"type="submit">Sendcomment</button>
/<form>
/<div>
/<section>
<br><hr>
!<--Footer Area Start-->
<footer>
<div class="col-md-6text-lg-center>"
<p class="footer-link">Copyright ©2019<a href="#" class="text-info">DailyJuice</a></p>
/<div>
/<div>
/<footer>
!<--Footer Area End-->
/<body>
/<html>

More Related Content

Similar to Daliy juice

Gaurav Jatav , BCA Third Year
Gaurav Jatav , BCA Third YearGaurav Jatav , BCA Third Year
Gaurav Jatav , BCA Third Year
Dezyneecole
 
Bootstrap 3 Cheat Sheet PDF Reference
Bootstrap 3 Cheat Sheet PDF ReferenceBootstrap 3 Cheat Sheet PDF Reference
Bootstrap 3 Cheat Sheet PDF Reference
Bootstrap Creative
 
Lecture 03 HTML&CSS Part 2
Lecture 03   HTML&CSS Part 2Lecture 03   HTML&CSS Part 2
Lecture 03 HTML&CSS Part 2
KULeuven-OnlinePublishing
 
Practical file(XHTML)web designing
Practical file(XHTML)web designingPractical file(XHTML)web designing
Practical file(XHTML)web designing
ArtiSolanki5
 
Facebook.html
Facebook.htmlFacebook.html
Facebook.html
admin999
 
Facebook.html
Facebook.htmlFacebook.html
Facebook.html
admin999
 
zynga-online.facebook.html
zynga-online.facebook.htmlzynga-online.facebook.html
zynga-online.facebook.html
admin999
 
Skills development: HTML Code
Skills development: HTML CodeSkills development: HTML Code
Skills development: HTML Code
gab0804080
 
Ss 36932418[1]
Ss 36932418[1]Ss 36932418[1]
Ss 36932418[1]
Ya Jinda
 
Html Hands On
Html Hands OnHtml Hands On
Html Hands On
corneliuskoo
 
Bootstrap
BootstrapBootstrap
Bootstrap
Sarvesh Kushwaha
 
History of-christmas[1]
History of-christmas[1]History of-christmas[1]
History of-christmas[1]
emelyn feto
 
HTTP REQUEST RESPONSE OBJECT - WEB APPLICATION USING C# LAB
HTTP REQUEST RESPONSE OBJECT - WEB APPLICATION USING C# LABHTTP REQUEST RESPONSE OBJECT - WEB APPLICATION USING C# LAB
HTTP REQUEST RESPONSE OBJECT - WEB APPLICATION USING C# LAB
priya Nithya
 
Index of jquery template 2 Minuteman Summer Web Dev.
Index of jquery template 2 Minuteman Summer Web Dev.Index of jquery template 2 Minuteman Summer Web Dev.
Index of jquery template 2 Minuteman Summer Web Dev.
Daniel Downs
 
Kohana bootstrap - modal form
Kohana   bootstrap - modal formKohana   bootstrap - modal form
Kohana bootstrap - modal form
Julio Pari
 
Kohana bootstrap - modal form
Kohana   bootstrap - modal formKohana   bootstrap - modal form
Kohana bootstrap - modal form
Julio Pari
 
Introduction to Html by Ankitkumar Singh
Introduction to Html by Ankitkumar SinghIntroduction to Html by Ankitkumar Singh
Introduction to Html by Ankitkumar Singh
Ankitkumar Singh
 
Desenvolvimento web com Ruby on Rails (parte 2)
Desenvolvimento web com Ruby on Rails (parte 2)Desenvolvimento web com Ruby on Rails (parte 2)
Desenvolvimento web com Ruby on Rails (parte 2)
Joao Lucas Santana
 
Upload[1]
Upload[1]Upload[1]
Upload[1]
lenimartina
 
jQuery Mobile - Desenvolvimento para dispositivos móveis
jQuery Mobile - Desenvolvimento para dispositivos móveisjQuery Mobile - Desenvolvimento para dispositivos móveis
jQuery Mobile - Desenvolvimento para dispositivos móveis
Pablo Garrido
 

Similar to Daliy juice (20)

Gaurav Jatav , BCA Third Year
Gaurav Jatav , BCA Third YearGaurav Jatav , BCA Third Year
Gaurav Jatav , BCA Third Year
 
Bootstrap 3 Cheat Sheet PDF Reference
Bootstrap 3 Cheat Sheet PDF ReferenceBootstrap 3 Cheat Sheet PDF Reference
Bootstrap 3 Cheat Sheet PDF Reference
 
Lecture 03 HTML&CSS Part 2
Lecture 03   HTML&CSS Part 2Lecture 03   HTML&CSS Part 2
Lecture 03 HTML&CSS Part 2
 
Practical file(XHTML)web designing
Practical file(XHTML)web designingPractical file(XHTML)web designing
Practical file(XHTML)web designing
 
Facebook.html
Facebook.htmlFacebook.html
Facebook.html
 
Facebook.html
Facebook.htmlFacebook.html
Facebook.html
 
zynga-online.facebook.html
zynga-online.facebook.htmlzynga-online.facebook.html
zynga-online.facebook.html
 
Skills development: HTML Code
Skills development: HTML CodeSkills development: HTML Code
Skills development: HTML Code
 
Ss 36932418[1]
Ss 36932418[1]Ss 36932418[1]
Ss 36932418[1]
 
Html Hands On
Html Hands OnHtml Hands On
Html Hands On
 
Bootstrap
BootstrapBootstrap
Bootstrap
 
History of-christmas[1]
History of-christmas[1]History of-christmas[1]
History of-christmas[1]
 
HTTP REQUEST RESPONSE OBJECT - WEB APPLICATION USING C# LAB
HTTP REQUEST RESPONSE OBJECT - WEB APPLICATION USING C# LABHTTP REQUEST RESPONSE OBJECT - WEB APPLICATION USING C# LAB
HTTP REQUEST RESPONSE OBJECT - WEB APPLICATION USING C# LAB
 
Index of jquery template 2 Minuteman Summer Web Dev.
Index of jquery template 2 Minuteman Summer Web Dev.Index of jquery template 2 Minuteman Summer Web Dev.
Index of jquery template 2 Minuteman Summer Web Dev.
 
Kohana bootstrap - modal form
Kohana   bootstrap - modal formKohana   bootstrap - modal form
Kohana bootstrap - modal form
 
Kohana bootstrap - modal form
Kohana   bootstrap - modal formKohana   bootstrap - modal form
Kohana bootstrap - modal form
 
Introduction to Html by Ankitkumar Singh
Introduction to Html by Ankitkumar SinghIntroduction to Html by Ankitkumar Singh
Introduction to Html by Ankitkumar Singh
 
Desenvolvimento web com Ruby on Rails (parte 2)
Desenvolvimento web com Ruby on Rails (parte 2)Desenvolvimento web com Ruby on Rails (parte 2)
Desenvolvimento web com Ruby on Rails (parte 2)
 
Upload[1]
Upload[1]Upload[1]
Upload[1]
 
jQuery Mobile - Desenvolvimento para dispositivos móveis
jQuery Mobile - Desenvolvimento para dispositivos móveisjQuery Mobile - Desenvolvimento para dispositivos móveis
jQuery Mobile - Desenvolvimento para dispositivos móveis
 

Recently uploaded

DEEP LEARNING FOR SMART GRID INTRUSION DETECTION: A HYBRID CNN-LSTM-BASED MODEL
DEEP LEARNING FOR SMART GRID INTRUSION DETECTION: A HYBRID CNN-LSTM-BASED MODELDEEP LEARNING FOR SMART GRID INTRUSION DETECTION: A HYBRID CNN-LSTM-BASED MODEL
DEEP LEARNING FOR SMART GRID INTRUSION DETECTION: A HYBRID CNN-LSTM-BASED MODEL
ijaia
 
2. protection of river banks and bed erosion protection works.ppt
2. protection of river banks and bed erosion protection works.ppt2. protection of river banks and bed erosion protection works.ppt
2. protection of river banks and bed erosion protection works.ppt
abdatawakjira
 
Object Oriented Analysis and Design - OOAD
Object Oriented Analysis and Design - OOADObject Oriented Analysis and Design - OOAD
Object Oriented Analysis and Design - OOAD
PreethaV16
 
UNIT 4 LINEAR INTEGRATED CIRCUITS-DIGITAL ICS
UNIT 4 LINEAR INTEGRATED CIRCUITS-DIGITAL ICSUNIT 4 LINEAR INTEGRATED CIRCUITS-DIGITAL ICS
UNIT 4 LINEAR INTEGRATED CIRCUITS-DIGITAL ICS
vmspraneeth
 
一比一原版(USF毕业证)旧金山大学毕业证如何办理
一比一原版(USF毕业证)旧金山大学毕业证如何办理一比一原版(USF毕业证)旧金山大学毕业证如何办理
一比一原版(USF毕业证)旧金山大学毕业证如何办理
uqyfuc
 
Blood finder application project report (1).pdf
Blood finder application project report (1).pdfBlood finder application project report (1).pdf
Blood finder application project report (1).pdf
Kamal Acharya
 
4. Mosca vol I -Fisica-Tipler-5ta-Edicion-Vol-1.pdf
4. Mosca vol I -Fisica-Tipler-5ta-Edicion-Vol-1.pdf4. Mosca vol I -Fisica-Tipler-5ta-Edicion-Vol-1.pdf
4. Mosca vol I -Fisica-Tipler-5ta-Edicion-Vol-1.pdf
Gino153088
 
Applications of artificial Intelligence in Mechanical Engineering.pdf
Applications of artificial Intelligence in Mechanical Engineering.pdfApplications of artificial Intelligence in Mechanical Engineering.pdf
Applications of artificial Intelligence in Mechanical Engineering.pdf
Atif Razi
 
ITSM Integration with MuleSoft.pptx
ITSM  Integration with MuleSoft.pptxITSM  Integration with MuleSoft.pptx
ITSM Integration with MuleSoft.pptx
VANDANAMOHANGOUDA
 
一比一原版(osu毕业证书)美国俄勒冈州立大学毕业证如何办理
一比一原版(osu毕业证书)美国俄勒冈州立大学毕业证如何办理一比一原版(osu毕业证书)美国俄勒冈州立大学毕业证如何办理
一比一原版(osu毕业证书)美国俄勒冈州立大学毕业证如何办理
upoux
 
Digital Twins Computer Networking Paper Presentation.pptx
Digital Twins Computer Networking Paper Presentation.pptxDigital Twins Computer Networking Paper Presentation.pptx
Digital Twins Computer Networking Paper Presentation.pptx
aryanpankaj78
 
一比一原版(uoft毕业证书)加拿大多伦多大学毕业证如何办理
一比一原版(uoft毕业证书)加拿大多伦多大学毕业证如何办理一比一原版(uoft毕业证书)加拿大多伦多大学毕业证如何办理
一比一原版(uoft毕业证书)加拿大多伦多大学毕业证如何办理
sydezfe
 
Height and depth gauge linear metrology.pdf
Height and depth gauge linear metrology.pdfHeight and depth gauge linear metrology.pdf
Height and depth gauge linear metrology.pdf
q30122000
 
AI-Based Home Security System : Home security
AI-Based Home Security System : Home securityAI-Based Home Security System : Home security
AI-Based Home Security System : Home security
AIRCC Publishing Corporation
 
Data Driven Maintenance | UReason Webinar
Data Driven Maintenance | UReason WebinarData Driven Maintenance | UReason Webinar
Data Driven Maintenance | UReason Webinar
UReason
 
Accident detection system project report.pdf
Accident detection system project report.pdfAccident detection system project report.pdf
Accident detection system project report.pdf
Kamal Acharya
 
Introduction to Computer Networks & OSI MODEL.ppt
Introduction to Computer Networks & OSI MODEL.pptIntroduction to Computer Networks & OSI MODEL.ppt
Introduction to Computer Networks & OSI MODEL.ppt
Dwarkadas J Sanghvi College of Engineering
 
Mechatronics material . Mechanical engineering
Mechatronics material . Mechanical engineeringMechatronics material . Mechanical engineering
Mechatronics material . Mechanical engineering
sachin chaurasia
 
TIME TABLE MANAGEMENT SYSTEM testing.pptx
TIME TABLE MANAGEMENT SYSTEM testing.pptxTIME TABLE MANAGEMENT SYSTEM testing.pptx
TIME TABLE MANAGEMENT SYSTEM testing.pptx
CVCSOfficial
 
Tools & Techniques for Commissioning and Maintaining PV Systems W-Animations ...
Tools & Techniques for Commissioning and Maintaining PV Systems W-Animations ...Tools & Techniques for Commissioning and Maintaining PV Systems W-Animations ...
Tools & Techniques for Commissioning and Maintaining PV Systems W-Animations ...
Transcat
 

Recently uploaded (20)

DEEP LEARNING FOR SMART GRID INTRUSION DETECTION: A HYBRID CNN-LSTM-BASED MODEL
DEEP LEARNING FOR SMART GRID INTRUSION DETECTION: A HYBRID CNN-LSTM-BASED MODELDEEP LEARNING FOR SMART GRID INTRUSION DETECTION: A HYBRID CNN-LSTM-BASED MODEL
DEEP LEARNING FOR SMART GRID INTRUSION DETECTION: A HYBRID CNN-LSTM-BASED MODEL
 
2. protection of river banks and bed erosion protection works.ppt
2. protection of river banks and bed erosion protection works.ppt2. protection of river banks and bed erosion protection works.ppt
2. protection of river banks and bed erosion protection works.ppt
 
Object Oriented Analysis and Design - OOAD
Object Oriented Analysis and Design - OOADObject Oriented Analysis and Design - OOAD
Object Oriented Analysis and Design - OOAD
 
UNIT 4 LINEAR INTEGRATED CIRCUITS-DIGITAL ICS
UNIT 4 LINEAR INTEGRATED CIRCUITS-DIGITAL ICSUNIT 4 LINEAR INTEGRATED CIRCUITS-DIGITAL ICS
UNIT 4 LINEAR INTEGRATED CIRCUITS-DIGITAL ICS
 
一比一原版(USF毕业证)旧金山大学毕业证如何办理
一比一原版(USF毕业证)旧金山大学毕业证如何办理一比一原版(USF毕业证)旧金山大学毕业证如何办理
一比一原版(USF毕业证)旧金山大学毕业证如何办理
 
Blood finder application project report (1).pdf
Blood finder application project report (1).pdfBlood finder application project report (1).pdf
Blood finder application project report (1).pdf
 
4. Mosca vol I -Fisica-Tipler-5ta-Edicion-Vol-1.pdf
4. Mosca vol I -Fisica-Tipler-5ta-Edicion-Vol-1.pdf4. Mosca vol I -Fisica-Tipler-5ta-Edicion-Vol-1.pdf
4. Mosca vol I -Fisica-Tipler-5ta-Edicion-Vol-1.pdf
 
Applications of artificial Intelligence in Mechanical Engineering.pdf
Applications of artificial Intelligence in Mechanical Engineering.pdfApplications of artificial Intelligence in Mechanical Engineering.pdf
Applications of artificial Intelligence in Mechanical Engineering.pdf
 
ITSM Integration with MuleSoft.pptx
ITSM  Integration with MuleSoft.pptxITSM  Integration with MuleSoft.pptx
ITSM Integration with MuleSoft.pptx
 
一比一原版(osu毕业证书)美国俄勒冈州立大学毕业证如何办理
一比一原版(osu毕业证书)美国俄勒冈州立大学毕业证如何办理一比一原版(osu毕业证书)美国俄勒冈州立大学毕业证如何办理
一比一原版(osu毕业证书)美国俄勒冈州立大学毕业证如何办理
 
Digital Twins Computer Networking Paper Presentation.pptx
Digital Twins Computer Networking Paper Presentation.pptxDigital Twins Computer Networking Paper Presentation.pptx
Digital Twins Computer Networking Paper Presentation.pptx
 
一比一原版(uoft毕业证书)加拿大多伦多大学毕业证如何办理
一比一原版(uoft毕业证书)加拿大多伦多大学毕业证如何办理一比一原版(uoft毕业证书)加拿大多伦多大学毕业证如何办理
一比一原版(uoft毕业证书)加拿大多伦多大学毕业证如何办理
 
Height and depth gauge linear metrology.pdf
Height and depth gauge linear metrology.pdfHeight and depth gauge linear metrology.pdf
Height and depth gauge linear metrology.pdf
 
AI-Based Home Security System : Home security
AI-Based Home Security System : Home securityAI-Based Home Security System : Home security
AI-Based Home Security System : Home security
 
Data Driven Maintenance | UReason Webinar
Data Driven Maintenance | UReason WebinarData Driven Maintenance | UReason Webinar
Data Driven Maintenance | UReason Webinar
 
Accident detection system project report.pdf
Accident detection system project report.pdfAccident detection system project report.pdf
Accident detection system project report.pdf
 
Introduction to Computer Networks & OSI MODEL.ppt
Introduction to Computer Networks & OSI MODEL.pptIntroduction to Computer Networks & OSI MODEL.ppt
Introduction to Computer Networks & OSI MODEL.ppt
 
Mechatronics material . Mechanical engineering
Mechatronics material . Mechanical engineeringMechatronics material . Mechanical engineering
Mechatronics material . Mechanical engineering
 
TIME TABLE MANAGEMENT SYSTEM testing.pptx
TIME TABLE MANAGEMENT SYSTEM testing.pptxTIME TABLE MANAGEMENT SYSTEM testing.pptx
TIME TABLE MANAGEMENT SYSTEM testing.pptx
 
Tools & Techniques for Commissioning and Maintaining PV Systems W-Animations ...
Tools & Techniques for Commissioning and Maintaining PV Systems W-Animations ...Tools & Techniques for Commissioning and Maintaining PV Systems W-Animations ...
Tools & Techniques for Commissioning and Maintaining PV Systems W-Animations ...
 

Daliy juice

  • 1. ‫بحث‬ ‫مشروع‬ ‫الويب‬ ‫برمجيات‬ ‫(عن‬daily juice) ‫الغامدي‬ ‫احمد‬ ‫إبراهيم‬ ‫تقديم‬ 439231483
  • 2.
  • 3.
  • 4. !<DOCTYPE html> <html> <head> <meta charset="utf-8>" <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no>" <meta http-equiv="x-ua-compatible" content="ie=edge>" <link href="css/bootstrap.css" rel="stylesheet>/ " <link href="css/style.css" rel="stylesheet>/ " <title>Daily Juice</title> /<head> <body> !<--Navigation Bar start... This is the header of the main page--> <nav class="navbar navbar-light bg-faded navbar-fixed-top>" <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse" data-target="#CollapseNavbar" aria- controls="CollapseNavbar" aria-expanded="false" aria-label="Toggle Navigation">&#9776;</button> <div class="collapse navbar-toggleable-xs" id="CollapseNavbar>" !<--this is the logo of the website in the top nav--> <a class="navbar-brand" href="#"><img src="img/logo1.jpg" alt="Event logo" height="40"></a> <div class="collapse navbar-toggleable-xs>" <ul class="nav navbar-nav pull-lg-right>" !<--the index paage is always active means that its highlighted--> <li class="nav-item active>" <a class="nav-link" href="index.html">Home</a> /<li> <li class="nav-item>" <a class="nav-link" href="menu.html">Menu</a> /<li> <li class="nav-item>" <a class="nav-link" href="about.html">About</a> /<li> <li class="nav-item>" <a class="nav-link" href="contact.html">Contact</a> /<li> /<ul> /<div> /<nav> !<--Navigation Bar End--> <div class="container-fluid"><br><br><br> /<div> <div class="container-fluid>" <img src="img/main.png" alt="Event logo" width="100%>" /<div>
  • 5. <br><br> !<--Title Start... the introdution--> <section> <div class="container>" <h1 class="text-lg-center display-4">juice, smoothies <small class="text-muted">and more!</small></h1> <p class="text-lg-center">Daily Juice is on a mission to create great tasting and nutritious juices, smoothies, bowls and bites. our menu is full of fresh offerings that are equally craveable and guilt-free. </p> <p class="text-lg-center>" we take a lot of pride in serving products that are high in nutritional value. our juices are made fresh to order, and our sm oothies are made with frozen fruit instead of ice – which is commonly used by other companies as a filler ingredient. we want your drinks to be full of nourishment, not fillers. best of all, we have created a juice bar experience built on convenience. we believe healthy food should be as accessible as fast food. so beyond our made-to-order menu, all of our stores are stocked with grab-and-go options that are perfect for a quick, healthy bite or sip. /<p> <p class="text-lg-center">whether you are a juicing novice or you're a smoothie pro, we've crafted unique recipes that are packed with nutrition, taste amazing and are a quick way to fuel up on healthy ingredients!</p> /<div> <br><br><hr> !<--the three options--> <div class="container>" <div class="col-md-4>" <div class="figure>" <a href="menu.html" ><img class="figure-img img-fluid img-rounded" src="img/1.jpg" alt="Concert Category>" <div class="centered"><h1>Menu</h1></div> /<a> /<div> /<div> <div class="col-md-4>" <div class="figure>" <a href="about.html> " <img class="figure-img img-fluid img-rounded" src="img/2.jpg" alt="Book Fair Category>" <div class="centered"><h1>About us</h1></div> /<a> /<div> /<div> <div class="col-md-4>" <div class="figure>" <a href="contact.html> " <img class="figure-img img-fluid img-rounded" src="img/4.jpg" alt="Football Category>" <div class="centered"><h1>Contacts </h1></div> /<a> /<div> /<div>
  • 6. /<section> !<--End--> <br><hr> !<--section2 Start--> <section> <div class="last-review backgreen>" <div class="container>" <div class="col-md-8>" <div> <h2 class="display-4"><img class="figure-img img-fluid img-rounded" src="img/55.png"> </h2> <blockquote class="blockquote>" <p> we take a lot of pride in using ingredients that are high in quality, responsibly sourced, nutrient-rich, and plant-based to help power you through your daily routine. <p> we never use any added fillers, syrups, sugars or artificial ingredients of any kind and we make all of our menu items fresh for you every single day. /<p> /<blockquote> /<div> /<div> /<div> /<div> /<section> !<--section2 End--> <br> !<--Footer Area Start--> <footer> <div class="col-md-6 text-lg-center>" <p class="footer-link">Copyright © 2019 <a href="#" class="text-info">Daily Juice</a></p> /<div> /<div> /<footer> !<--Footer Area End--> /<body> /<html>
  • 7.
  • 8. !<DOCTYPE html> <html lang="en>" <head> <meta charset="UTF-8>" <link href="css/bootstrap.css" rel="stylesheet>/ " <link href="css/style.css" rel="stylesheet>/ " <link href="css/mycarousel.css" rel="stylesheet>/ " <title>Menu|DailyJuice</title> /<head> <body> !<--Responsive NavbarDesign--> <nav class="navbar navbar-light bg-faded>" <button class="navbar-toggler hidden-sm-up"type="button"data-toggle="collapse" data-target="#CollapseNavbar" aria- controls="CollapseNavbar"aria-expanded="false" aria-label="Toggle Navigation">&#9776;</button> <div class="collapse navbar-toggleable-xs" id="CollapseNavbar>" <a class="navbar-brand" href="#"><imgsrc="img/logo1.jpg"alt="Event logo"height="40"></a> <ul class="nav navbar-navpull-md-right>" <li class="nav-item"><a href="index.html" class="nav-link">Home</a></li> <li class="nav-itemactive"><ahref="menu.html" class="nav-link">Menu</a></li> <li class="nav-item"><a href="about.html" class="nav-link">About</a></li> <li class="nav-item"><a href="contact.html" class="nav-link">Contact</a></li> /<ul> /<div> /<nav> !<--juice Cover Design--> <section class=" text-xs-center>" <div class="container>" <div class="col-md-4>" <div class="figure>" <div> <img class="figure-imgimg-fluidimg-rounded" src="img/juice.jpg" alt>""= /<div> /<div> /<div> <div class="col-md-4>" <div class="figure>"
  • 9. <imgclass="figure-imgimg-fluidimg-rounded" src="img/juice2.jpg" alt>" "= /<div> /<div> <div class="col-md-4>" <div class="figure>" <div> <img class="figure-imgimg-fluidimg-rounded" src="img/juice.jpg" alt>""= /<div> /<div> /<div> /<div> /<section> !<--juice List--> <section> <div class="container>" <div class="col-md-3>" <div class="card>" <div class="card-blocktext-lg-center>" <h4 class="card-title">GINGER GREENS</h4> <h6 class="card-subtitle text-muted">200| 300 cal</h6> /<div> <div class="card-block>" <p class="card-text">ginger • apple • kale • spinach• cucumber • parsley• lemon</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">WE GOT THE BEET™</h4> <h6 class="card-subtitle text-muted">160 | 250cal</h6> /<div> <div class="card-block>" <p class="card-text">beet • carrot • apple • ginger • lemon</p> /<div> /<div> /<div> <div class="col-md-3"> <div class="card>"
  • 10. <div class="card-block text-lg-center>" <h4 class="card-title">ORANGE YOU GLAD™</h4> <h6 class="card-subtitle text-muted">180| 270 cal</h6> /<div> <div class="card-block>" <p class="card-text">carrot • apple • pineapple• mint • ginger • lemon</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-blocktext-lg-center>" <h4 class="card-title">SUPER GREENS</h4> <h6 class="card-subtitle text-muted">70 | 100cal</h6> /<div> <div class="card-block>" <p class="card-text">wheatgrass • celery• kale • spinach • cucumber • parsley • lemon</p> /<div> /<div> /<div> /<div> /<section> <section> <div class="container>" <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">PINEAPPLEGREENS</h4> <h6 class="card-subtitle text-muted">100 | 180cal</h6> /<div> <div class="card-block>" <p class="card-text">cucumber• pineapple • mint • kale • spinach• parsley • lemon</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">SWEET GREENS</h4>
  • 11. <h6 class="card-subtitle text-muted">240| 360 cal</h6> /<div> <div class="card-block>" <p class="card-text">apple • kale • spinach• cucumber • parsley• lemon</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-blocktext-lg-center>" <h4 class="card-title">MEAN GREENS</h4> <h6 class="card-subtitle text-muted">70 | 110 cal</h6> /<div> <div class="card-block>" <p class="card-text">jalapeño • celery • kale • spinach• cucumber • parsley• lemon</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">FRESH GREENS</h4> <h6 class="card-subtitle text-muted">200 | 300cal</h6> /<div> <div class="card-block>" <p class="card-text">celery• kale • spinach • cucumber • parsley • lemon</p> /<div> /<div> /<div> /<div> /<section> <div class="container"> <hr> <button class="btnbtn-info-outlinepull-lg-right">OrderNow</button> </div> <br> <br> !<--smooothies section--------------------------------------------------------------------------------------> <hr><br></br> <section class=" text-xs-center>" <div class="container>" <div class="col-md-4>"
  • 12. <div class="figure>" <div> <imgclass="figure-imgimg-fluidimg-rounded" src="img/smo1.png"alt>""= /<div> /<div> /<div> <div class="col-md-4>" <div class="figure>" <imgclass="figure-imgimg-fluidimg-rounded" src="img/smoothie2.jpg" alt>" "= /<div> /<div> <div class="col-md-4>" <div class="figure>" <div> <imgclass="figure-imgimg-fluidimg-rounded" src="img/smo1.png"alt>""= /<div> /<div> /<div> /<div> /<section> !<--juice List--> <section> <div class="container>" <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">THE DOC</h4> <h6 class="card-subtitle text-muted">380 | 490cal</h6> /<div> <div class="card-block>" <p class="card-text">kale • spinach • probiotics • spirulina • ginger • mint • blueberries • strawberries • banana • juiced apple</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">COCOA BANANA™</h4> <h6 class="card-subtitle text-muted">160| 250 cal</h6> /<div>
  • 13. <div class="card-block>" <p class="card-text">rawcacao powder • peanut butter • spinach• pinkhimalayansea salt • plant-based proteinpowder • banana • coconut milk</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-blocktext-lg-center>" <h4 class="card-title">MATCHA GREEN</h4> <h6 class="card-subtitle text-muted">270| 450 cal</h6> /<div> <div class="card-block>" <p class="card-text">matchagreen tea • macapowder • cashews • spinach• mango• banana • lemon• pink himalayansea salt • almondmilk</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">COFFEE JANET™</h4> <h6 class="card-subtitle text-muted">480 | 730cal</h6> /<div> <div class="card-block>" <p class="card-text">rawcacao powder • coffee • hempseeds • almondbutter • banana • plant-based proteinpowder • himalayanpinksalt • almondmilk</p> /<div> /<div> /<div> /<div> /<section> <section> <div class="container>" <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">BERRY GOOD</h4> <h6 class="card-subtitle text-muted">320| 440 cal</h6>
  • 14. /<div> <div class="card-block>" <p class="card-text">blueberries • banana • cashews • lemon • coconut milk</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-blocktext-lg-center>" <h4 class="card-title">PB&J</h4> <h6 class="card-subtitle text-muted">570| 660 cal</h6> /<div> <div class="card-block>" <p class="card-text">peanut butter • banana • strawberries • flax seedoil • applejuice</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">GREEN SMOOTHIE</h4> <h6 class="card-subtitle text-muted">270 | 360 cal</h6> /<div> <div class="card-block>" <p class="card-text">kale • spinach • pineapple • banana• lemon• coconut milk• apple juice</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">MINT TO BE</h4> <h6 class="card-subtitle text-muted">240 | 350cal</h6> /<div> <div class="card-block>" <p class="card-text">mint • mango • pineapple • coconut milk• applejuice</p> /<div> /<div>
  • 15. /<div> /<div> </section> <div class="container"> <hr> <button class="btn btn-info-outline pull-lg-right">Order Now</button> </div> <br> <br> !<--smooothies bowl section--------------------------------------------------------------------------------------> <hr><br></br> <section class=" text-xs-center>" <div class="container>" <div class="col-md-4>" <div class="figure>" <div> <img class="figure-imgimg-fluidimg-rounded" src="img/bowl55.png" alt>""= /<div> /<div> /<div> <div class="col-md-4>" <div class="figure>" <imgclass="figure-imgimg-fluidimg-rounded" src="img/smobowl.PNG" alt>" "= /<div> /<div> <div class="col-md-4>" <div class="figure>" <div> <img class="figure-imgimg-fluidimg-rounded" src="img/bowl55.png" alt>""= /<div> /<div> /<div> /<div> /<section> !<--menustarts-----------> !<--juice List------------------------------------------> <section> <div class="container>" <div class="col-md-3>" <div class="card>" <div class="card-blocktext-lg-center>" <h4 class="card-title">AÇAÍBOWL</h4> <h6 class="card-subtitle text-muted">660cal</h6> /<div>
  • 16. <div class="card-block>" <p class="card-text">apple juice • açaí • blueberries • avocado• banana • toppedwith granola • banana• strawberries • almondbutter • hemp seeds • local honey</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">COCOABANANA™</h4> <h6 class="card-subtitle text-muted">540 cal</h6> /<div> <div class="card-block>" <p class="card-text">coconut water• mango• banana • spirulina • toppedwith granola • banana • blueberries • peanut butter • coconut flakes • bee pollen• local honey</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-block text-lg-center>" <h4 class="card-title">DRAGON FRUIT BOWL</h4> <h6 class="card-subtitle text-muted">460cal </h6> /<div> <div class="card-block>" <p class="card-text">apple juice • dragon fruit • mango• toppedwith granola • banana • strawberries • local honey</p> /<div> /<div> /<div> <div class="col-md-3>" <div class="card>" <div class="card-blocktext-lg-center>" <h4 class="card-title">CHOCOLATEBOWL</h4> <h6 class="card-subtitle text-muted">650 cal</h6> /<div> <div class="card-block>" <p class="card-text">almondmilk • avocado• banana • hempseeds • rawcacao • toppedwith granola • banana • strawberries • cacao nibs • almondbutter • hemp seeds • cacao nibs • local honey</p>
  • 17. /<div>/<div>/<div>/<div> /<section> <div class="container"> <hr> <button class="btnbtn-info-outline pull-lg-right">Order Now</button> </div> <br><br> !<--Endof the menu-------------------------------------------------------> <nav class="text-lg-center"aria-label="Page navigation Try>" <ul class="pagination>" <li class="page-item"> <a class="page-link"href="#"aria-label="Prev>" <span aria-hidden="true">&laquo;</span> <span class="sr-only">Prev</span> /<a> /<li> <li class="page-item"><a class="page-link" href="#">1</a></li> <li class="page-item"><a class="page-link" href="#">2</a></li> <li class="page-item"><a class="page-link" href="#">3</a></li> <li class="page-item"><a class="page-link" href="#">4</a></li> <li class="page-item"><a class="page-link" href="#">5</a></li> <li class="page-item>" <a class="page-link"href="#"aria-label="Next>" <span aria-hidden="true">&raquo;</span> <span class="sr-only">Next</span> /<a> /<li> /<ul> /<nav> !<--FooterArea Start--> !<--Footer Area Start--> <footer> <div class="col-md-6text-lg-center>" <p class="footer-link">Copyright ©2019<a href="#" class="text-info">DailyJuice</a></p> /<div> /<div> /<footer> !<--Footer Area End--> /<body> /<html>
  • 18.
  • 19. !<DOCTYPE html> <html> <head> <meta charset="utf-8>" <meta name="viewport"content="width=device-width, initial-scale=1, shrink-to-fit=no>" <meta http-equiv="x-ua-compatible" content="ie=edge>" <link href="css/bootstrap.css" rel="stylesheet>/ " <link href="css/style.css" rel="stylesheet>/ " <link href="css/mycarousel.css" rel="stylesheet>/ " <title>About|DailyJuice</title> /<head> <body> !<--NavigationBar start...This is theheaderof the main page--> <nav class="navbarnavbar-light bg-fadednavbar-fixed-top>" <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse"data-target="#CollapseNavbar"aria- controls="CollapseNavbar"aria-expanded="false" aria-label="Toggle Navigation">&#9776;</button> <div class="collapse navbar-toggleable-xs" id="CollapseNavbar>" !<--this is thelogo ofthe website in the topnav--> <a class="navbar-brand"href="#"><imgsrc="img/logo1.jpg" alt="Event logo" height="40"></a> <div class="collapse navbar-toggleable-xs>" <ul class="nav navbar-navpull-lg-right>" <li class="nav-item>" <a class="nav-link"href="index.html">Home</a> /<li> <li class="nav-item>" <a class="nav-link"href="menu.html">Menu</a> /<li> <li class="nav-itemactive>" <a class="nav-link"href="about.html">About</a> /<li> <li class="nav-item>" <a class="nav-link"href="contact.html">Contact</a> /<li> /<ul> /<div> /<nav> !<--NavigationBar End--> <div class="container-fluid"><br><br> /<div>
  • 20. <div class="container-fluid>" <img src="img/about.jpg"alt="Event logo"width="100%" height="550px>" /<div> <br><br> <!--Title Start... about--> <section> <div class="container>" <h1 class="text-lg-centerdisplay-4">About </h1> <hr> <p class="text-lg-center">DailyJuice is plant-based, gluten-free, andorganic when possible. We always use 100% whole fruits andvegetables from scratch.Nothingprocessed, nothingyucky. Simply said, we are an “I-want-to-eat-healthy-and-feel-great” type of place. Whether youwant a quick smoothieon thego, a growler of freshjuice for your fridge or a full sit -down delicious meal, we are delightedto offergreat-tasting, super-nutritious juices, smoothies,andfoods. We have fun withwhat we do andlook forwardtobeingof service to youin anycapacity. Have fun,be amazing!</p> /<div> <br><br><hr> <!--Footer Area Start--> <footer> <div class="col-md-6text-lg-center>" <p class="footer-link">Copyright ©2019<a href="#" class="text-info">DailyJuice</a></p> /<div> /<div> /<footer> !<--Footer Area End--> /<body> /<html>
  • 22. <html lang="en>" <head> <meta charset="UTF-8>" <link href="css/bootstrap.css" rel="stylesheet>/ " <link href="css/style.css" rel="stylesheet>/ " <link href="css/mycarousel.css" rel="stylesheet>/ " <title>Contact|DailyJuice</title> /<head> <body> !<--Responsive NavbarDesign--> <nav class="navbar navbar-light bg-faded>" <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse"data-target="#CollapseNavbar"aria- controls="CollapseNavbar"aria-expanded="false" aria-label="Toggle Navigation">&#9776;</button> <div class="collapse navbar-toggleable-xs" id="CollapseNavbar>" <a class="navbar-brand" href="#"><imgsrc="img/logo1.jpg" alt="Event logo"height="40"></a> <ul class="nav navbar-navpull-md-right>" <li class="nav-item"><ahref="index.html"class="nav-link">Home</a></li> <li class="nav-item"><a href="menu.html" class="nav-link">Menu</a></li> <li class="nav-item"><ahref="about.html"class="nav-link">About</a></li> <li class="nav-itemactive"><a href="contact.html"class="nav-link">Contact</a></li> /<ul> /<div> /<nav> <div class="jumbotron event-detail-lg>" <h1 class="display-4text-lg-centertext-uppercase">Contact Us </h1> /<div> <section class="container>" <div class="col-md-6>" <iframe width="560"height="315"src="https://www.youtube.com/embed/GFmTa2FuEP4"frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> /<div> <div class="col-md-6>" <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d9755.10085875133!2d4.848296769775384!3d5 2.320081300000034!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c5e1d8d2feb101%3A0x6c98e492d59acdc3 !2sRunnersworld+Amsterdamse+Bos!5e0!3m2!1sen!2str!4v1470328369055"width="450" height="315"frameborder="0"style="border:0; margin-left:30px" allowfullscreen></iframe> /<div> /<section> !<--comment section-->
  • 23. <br><br> <section class="container>" <hr> <h4 class="display-2text-md-center">Write your comment !</h4> <div class="col-md-8>" <form> <fieldset class="form-group>" <input type="text"class="form-control"id="Name"placeholder="Name"></input> /<fieldset> <fieldset class="form-group>" <input type="email"class="form-control" id="Email"placeholder="Email"></input> /<fieldset> <fieldset class="form-group>" <textarearows="3"class="form-control" placeholder="Message"></textarea> /<fieldset> <button class="btn btn-success-outline pull-lg-right"type="submit">Sendcomment</button> /<form> /<div> /<section> <br><hr> !<--Footer Area Start--> <footer> <div class="col-md-6text-lg-center>" <p class="footer-link">Copyright ©2019<a href="#" class="text-info">DailyJuice</a></p> /<div> /<div> /<footer> !<--Footer Area End--> /<body> /<html>