|
|
Line 1: |
Line 1: |
- | <!DOCTYPE html>
| + | {{:Team:CityU_HK/Template}} |
- | <html lang="en"> | + | <html> |
- | <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>Verona homepage</title>
| + | |
| | | |
- | <!-- Bootstrap -->
| |
- | <link href="css/bootstrap.min.css" rel="stylesheet">
| |
| | | |
| + | <head> |
| + | <link type="text/css" rel="stylesheet" href="Onedrive/.../bootstrap-3.2.0-dist/css/bootstrap.min.css"/> |
| <style> | | <style> |
- | .col-md-12 {
| + | #project_description h1{ |
- | background:#369de1;
| + | color: white; |
| } | | } |
- | .row{
| + | |
- | margin:20px;
| + | #project_description p{ |
- | }
| + | line-height: 2.5em; |
- | .nav {
| + | font-size: 14px; |
- | background: #666666;
| + | |
- | }
| + | |
- | .nav li {
| + | |
- | list-style-type: none;
| + | |
- | float: left;
| + | |
- | font-size: 20px;
| + | |
- | }
| + | |
- | .nav li a {
| + | |
- | color: white;
| + | |
- | text-decoration: none;
| + | |
- | padding: 6px 20px;
| + | |
- | margin: 0;
| + | |
- | }
| + | |
- | .nav a:hover {
| + | |
- | color:#FFD700;
| + | |
- | }
| + | |
- | .dropdown-menu li a {
| + | |
- | color: black;
| + | |
- | }
| + | |
- | ul.nav li.dropdown:hover > ul.dropdown-menu {
| + | |
- | display: block; | + | |
- | }
| + | |
- | form{
| + | |
- | position: relative;
| + | |
- | right: 10px;
| + | |
- | }
| + | |
- | .jumbotron {
| + | |
- | background-image: url(http://www.languatics.com/assets/Uploads/Languatics-Language-Immersion-Italian-Verona-Italy.jpg);
| + | |
- | background-repeat: none;
| + | |
- | color: #fff;
| + | |
- | height: 500px;
| + | |
- | margin:0;
| + | |
- | }
| + | |
- | .jumbotron h1 {
| + | |
- | position: relative;
| + | |
- | top: 170px;
| + | |
- | font-size: 60px;
| + | |
- | }
| + | |
- | .jumbotron p{
| + | |
- | position: relative;
| + | |
- | top: 190px;
| + | |
- | }
| + | |
- | .verona {
| + | |
- | margin: 0 50px;
| + | |
- | padding: 10px 200px 30px;
| + | |
- | line-height: 40px;
| + | |
- | }
| + | |
- | .container { | + | |
- | background-color:#dfdfd9;
| + | |
- | border-radius: 12px;
| + | |
- | }
| + | |
- | .thumbnail {
| + | |
- | margin-top:40px;
| + | |
- | margin-bottom:40px;
| + | |
- | height: 500px;
| + | |
- | }
| + | |
- | .thumbnail legend {
| + | |
- | margin:3px;
| + | |
- | text-align:center;
| + | |
- | width:100%
| + | |
- | }
| + | |
- | .thumbnail legend span{
| + | |
- | font-size: 14px;
| + | |
- | }
| + | |
- | footer {
| + | |
- | width: 100%;
| + | |
- | height: 100px;
| + | |
- | margin: 20px 0 0 0;
| + | |
- | padding: 20px 40px;
| + | |
- | text-align: center;
| + | |
- | color: white;
| + | |
- | background: rgba(0,0,0,.8);
| + | |
- | }
| + | |
- | footer img {
| + | |
- | display: block;
| + | |
| } | | } |
| </style> | | </style> |
| </head> | | </head> |
- |
| |
| | | |
| | | |
| <body> | | <body> |
- | <div id="wrapper" style="width:100%; text-align:center">
| |
- | <img src="img/verona_logo1 as Smart Object-1.jpg" width="586" height="167" alt="logo">
| |
- | </div>
| |
- |
| |
- | <div class="navbar navbar-static">
| |
- | <div class="navbar-inner">
| |
- | <ul role="navigation" class="nav">
| |
- | <li><a href="#">Get around</a></li>
| |
- | <li><a href="#">Place to stay</a></li>
| |
- | <li class="dropdown">
| |
- | <a href="#" data-toggle="dropdown" class="dropdown-toggle">Join a tour</a>
| |
- | <ul class="dropdown-menu">
| |
- | <li><a href="#">Art tour</a></li>
| |
- | <li><a href="#">Cycling tour</a></li>
| |
- | <li><a href="#">Garda Lake one day tour</a></li>
| |
- | <li class="divider"></li>
| |
- | <li><a href="#">Price</a></li>
| |
- | </ul>
| |
- | </li>
| |
- |
| |
- | <form class="navbar-form navbar-right" role="search">
| |
- | <div class="form-group">
| |
- | <input type="text" class="form-control" placeholder="Find you place!">
| |
- | <button type="submit" class="btn btn-default">Search</button>
| |
- | </form>
| |
- |
| |
- | </ul>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div id="carousel-example-generic" class="carousel slide" data-ride="carousel" style="width: 1400px; margin: 0 auto">
| |
| | | |
- | <!-- Indicators -->
| + | <table width="65%" border="0" align="center" style="background:#00306C;"> |
- | <ol class="carousel-indicators">
| + | <tr style="color:white"> |
- | <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
| + | <td style="text-align:Left;" rowspan="2" > |
- | <li data-target="#carousel-example-generic" data-slide-to="1"></li>
| + | <div id="project_description"><h1> Project Description</h1> <br><br> |
- | <li data-target="#carousel-example-generic" data-slide-to="2"></li>
| + | <p>Globally, the prevalence of obesity has reached epidemic proportions and is now one of the most pressing health problems worldwide. Because obesity is closely associated with chronic diseases such as diabetes, hypertension, stroke and cardiovascular diseases, the rise in obesity corresponds to a significant increase in mortality. According to the World Health Organization (WHO) 2014 report, the number of obese people has doubled since 1980. In 2008, 35% of adults were overweight and 11% were obese; and in 2012, more than 40 million children were overweight or obese. Because of the rising cost in healthcare and the associated social and economic problems related to obesity, various strategies to control and prevent obesity have been tested in recent years. |
- | </ol>
| + | |
- |
| + | |
- | <!-- Wrapper for slides -->
| + | |
- | <div class="carousel-inner">
| + | |
- | <div class="item active">
| + | |
- | <img src="img/verona_overview_1200x480.jpg" width="1562" height="625" alt="verona">
| + | |
- | <div class="carousel-caption">
| + | |
- | <h1>Explore the city.</h1>
| + | |
- | <p>Let's join the city tour to get around the ancient city</p>
| + | |
- | </div>
| + | |
- | </div>
| + | |
- | <div class="item">
| + | |
- | <img src="img/cycling_1200x480.jpg" width="1500" height="600" alt="cycling">
| + | |
- | <div class="carousel-caption">
| + | |
- | <h1>Join a cycling tour.</h1>
| + | |
- | </div>
| + | |
- | </div>
| + | |
- | <div class="item">
| + | |
- | <img src="img/lake_garda_1200x480.jpg" width="5000" height="2000" alt="lake garda">
| + | |
- | <div class="carousel-caption">
| + | |
- | <h1>Lake Garda</h1>
| + | |
- | <p>Climb up the mountain and have a look at the beautiful scenery.</p>
| + | |
- | </div>
| + | |
- | </div>
| + | |
- | </div>
| + | |
| | | |
- | <!-- Controls -->
| + | <br><br> |
- | <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
| + | |
- | <span class="glyphicon glyphicon-chevron-left"></span>
| + | |
- | </a>
| + | |
- | <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
| + | |
- | <span class="glyphicon glyphicon-chevron-right"></span>
| + | |
- | </a>
| + | |
- | </div>
| + | |
| | | |
- | <div class="verona">
| + | According to BBC news (2012), there has been an acute decline in fish stocks around the world whereby 85% of global fish stocks have been over-exploited. And because climate change has adversely affected agricultural output in general, this has resulted in humans becoming even more dependent on fishery products as an important source of protein and high-value nutrients. Docosahexaenoic acid (DHA) is an omega-3 fatty acid and is one of the vital nutrients obtained from fish, which is important for a variety of normal body functions including metabolism. Because the human body is unable to synthesize omega-3-fatty acids, it is normally obtained through our diet. It is predicted that DHA will become less available due to the rapid declines in fish stocks. Our project aims to develop a GEM called “Fit Coli” that could aid the human body to reduce fat absorption by biotransforming the fatty acids produced in the human gut to alpha-linolenic (ALA) which is then converted to docosahexaenoic acid (DHA) by the human body.</p> |
- | <h2>Verona</h2>
| + | </div> |
- | <p>Verona is a city straddling the Adige river in Veneto, northern Italy, with approximately 265,000 inhabitants and one of the seven chef-lieus of the region. It is the second largest city municipality in the region and the third of northeast Italy. There are many exciting and beautiful places to visit in Verona. You can either go to watch an opera in the Arena or get a cup of espresso in the Pizza Bar.</p>
| + | </td> |
- | </div>
| + | <td><img src="http://www6.cityu.edu.hk/wayfinder/GettingToU/img/u-circle.jpg" width="320" height="240" ></td> |
- |
| + | </tr> |
- | <div class="container">
| + | <tr> |
- | <div class="row">
| + | <td><img src="http://www6.cityu.edu.hk/wayfinder/GettingToU/img/u-circle.jpg" width="320" height="240" ></td> |
- | <div class="col-md-4">
| + | </tr> |
- | <div class="thumbnail">
| + | </table> |
- | <img alt="romeo and juliet" src="http://www.jaunted.com/files/3873/Romeo_Juliet_Balcony_Verona.jpg">
| + | <br><br><br><br> |
- | <div class="caption">
| + | |
- | <h3>Juliet's House</h3>
| + | |
- | <p>Every year hundreds of thousands of us trek to Verona to see the balcony where Juliet stood while Romeo declared his love.</p>
| + | |
- | <p>
| + | |
- | <a class="btn btn-primary" href="juliet's house.html">Learn more >></a>
| + | |
- | </p>
| + | |
- | </div>
| + | |
- | </div> <!end of .thumbnail-->
| + | |
- | </div> <!end of .col-md-4-->
| + | |
- |
| + | |
- |
| + | |
- | <div class="col-md-4">
| + | |
- | <div class="thumbnail">
| + | |
- | <img alt="Lake Garda" src="http://www.adoc.trentino.it/home/images/stories/laghi0906.jpg">
| + | |
- | <div class="caption">
| + | |
- | <h3>Lake Garda</h3>
| + | |
- | <p>Lake Garda is the largest lake in Italy. It is a popular holiday location and is located in Northern Italy, about half-way between Brescia and Verona, and between Venice and Milan. Glaciers formed this alpine region at the end of the last Ice Age. </p>
| + | |
- | <p>
| + | |
- | <a class="btn btn-primary" href="#">Learn more >></a>
| + | |
- | </p>
| + | |
- | </div>
| + | |
- | </div> <!end of .thumbnail-->
| + | |
- | </div> <!end of .col-md-4-->
| + | |
- |
| + | |
- |
| + | |
- | <div class="col-md-4">
| + | |
- | <div class="thumbnail">
| + | |
- | <img alt="Arena" src="http://images.kuoni.co.uk/73/verona-29203839-1377620593-ImageGalleryLightbox.jpg">
| + | |
- | <div class="caption">
| + | |
- | <h3>Arena di Verona</h3>
| + | |
- | <p>The Verona Arena is a Roman amphitheatre in Piazza Bra in Verona, Italy, which is internationally famous for the large-scale opera performances given there. It is one of the best preserved ancient structures of its kind.</p>
| + | |
- | <p>
| + | |
- | <a class="btn btn-primary" href="#">Learn more >></a>
| + | |
- | </p>
| + | |
- | </div>
| + | |
- | </div> <!end of .thumbnail-->
| + | |
- | </div> <!end of .col-md-4-->
| + | |
- | </div> <!--end of .row-->
| + | |
- | </div><!--end of #container-->
| + | |
| | | |
| | | |
| <footer> | | <footer> |
- | <h5 class="pull-left">Contact me:</h5> <br />
| + | <h2>Our Sponsors</h2> |
- | <a class="pull-left" href="http://facebook.com/maria.li1"> <img src="http://www.vishay.com/images/facebook.png"></a>
| + | <img src="http://upload.wikimedia.org/wikipedia/en/6/6c/New_England_Biolabs_%28logo%29.png"/> |
| </footer> | | </footer> |
| | | |
- | <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
| + | </body> |
- | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
| + | |
- | <!-- Include all compiled plugins (below), or include individual files as needed -->
| + | |
- | <script src="js/bootstrap.min.js"></script>
| + | |
- | <script>
| + | |
- | $('.carousel').carousel();
| + | |
- | </script>
| + | |
- | </body>
| + | |
| </html> | | </html> |