Jumat, 31 Maret 2017

PWEB Tugas 4

Source Code

<!DOCTYPE html>  
 <html lang="en">  
  <head>  
   <meta charset="utf-8">  
   <meta http-equiv="X-UA-Compatible" content="IE=edge">  
   <meta name="viewport" content="width=device-width, initial-scale=1">  
   <title>Beauty Village</title>  
   <link href="css/bootstrap.min.css" rel="stylesheet">  
   <link href="css/bootstrap.css" rel="stylesheet">  
   <link href="css/style.css" rel="stylesheet">  
  </head>  
  <body>  
   <div>  
    <nav class="navbar navbar-default">  
     <div class="container-fluid">  
      <div class="navbar-header">  
       <a class="navbar-brand" href="#">Beauty Village</a>  
      </div>  
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">  
       <ul class="nav navbar-nav">  
        <li class="active"><a href="#">Home</a></li>  
        <li><a href="#">Find Place</a></li>  
        <li><a href="#">About</a></li>  
       </ul>  
       <ul class="nav navbar-nav navbar-right">  
        <li><a href="#">Login</a></li>  
        <li><a href="#">Register</a></li>  
        </li>  
       </ul>  
      </div>  
     </div>  
    </nav>  
   </div>  
   <div>  
    <h1 align="center">The Beauty of Village</h1>  
    <p align="center">you just can't imagine how beatiful it is</p>  
    <p align="center">-----</p>  
    <br>  
   </div>  
   <div id="myCarousel" class="carousel slide" data-ride="carousel">  
    <ol class="carousel-indicators">  
     <li data-target="#myCarousel" data-slide-to="0" class="active"></li>  
     <li data-target="#myCarousel" data-slide-to="1"></li>  
     <li data-target="#myCarousel" data-slide-to="2"></li>  
     <li data-target="#myCarousel" data-slide-to="3"></li>  
    </ol>  
    <div class="carousel-inner" role="listbox">  
     <div class="item active">  
      <img src="farza.jpg" alt="Chania">  
     </div>  
     <div class="item">  
      <img src="2.jpg" alt="Chania">  
     </div>  
     <div class="item">  
      <img src="3.jpg" alt="Flower">  
     </div>  
     <div class="item">  
      <img src="4.jpg" alt="Flower">  
     </div>  
    </div>  
    <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">  
     <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>  
     <span class="sr-only">Previous</span>  
    </a>  
    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">  
     <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>  
     <span class="sr-only">Next</span>  
    </a>  
   </div>  
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>  
   <script src="js/bootstrap.min.js"></script>  
  </body>  
 </html>  

Tidak ada komentar:

Posting Komentar