Bootstrap/index.html at master · LucyTBCZ/Bootstrap · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<!doctype>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title> Bootstrap</title>
	<link rel="stylesheet" type="text/css" href="bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="style.css">
	<!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>

				<!--//LUCY// -->

	<header class="container-fluid">
		<section class="row">
			<!--Logo Airbnb-->
			<img src="https://tse2.mm.bing.net/th?id=OIP.kr-3d_By0p5MCbb-yk5IfAEnDT&pid=15.1&P=0&w=249&h=178" class="col-md-1">
			<!--Menu-->
			<ul class="nav nav-pills  col-md-offset-7 col-xs-12 col-md-4 menue">
	      		<li class="disabled"><a href="#">Devenez hôte</a></li>
	      		<li class="disabled"><a href="#">Aide</a></li>
	      		<li class="disabled"><a href="#">Inscription</a></li>
	      		<li class="disabled"><a href="#">Connexion</a></li>
	    	</ul>
	    </section>
	    <br>
	    <br>
	    <br>
	    <section class="container">
	    	<section class=" col-xs-1 col-md-offset-1 col-md-6">
	    		<!--Titre-->
	    		<h1 class=" titre"><b>Airbnb</b></h1>
	    		<!--paragraphe-->
	    		<h1 class="phrase">Réservez des logements <br> uniques et vivez là-bas comme <br> des locaux.</h1>
	    	</section>
		</section>
	</header>

			<!--//END LUCY// -->

			<!--//AURELIA// -->

	        <article class="container rechercher header">
        <!--formulaire de reservation -->
            <div class="row"> <!--met sur une ligne le questionnaire -->
                    <div class="categorie form-group col-lg-4 col-md-4 col-xs-12 div">
                    <!--responsive sur une base de 3 éléments pour grand et moyen (4*3:12), un élément pour petit(12) -->
                      <label>Où
                      <!--chaque label correspond à un élément du formulaire -->
                          <section class="titre form-control">
                             <option value="1">Partout</option>
                          </section>
                      </label>
                    </div>
                    <div class="categorie form-group col-lg-4 col-md-4 col-xs-12 div">
                      <label>Quand
                      <!--chaque label correspond à un élément du formulaire -->
                          <section class="titre form-control">
                             <option value="1">Dates indifférentes</option>
                          </section>
                      </label>
                    </div>
                    <div class="categorie form-group col-lg-4 col-md-4 col-xs-12 div">
                        <label>Voyageurs
                        <!--chaque label correspond à un élément du formulaire -->
                            <select class="titre form-control">
                                <option value="1 voyageur">1 voyageur</option>
                                <option value="2 voyageur">2 voyageur</option>
                                <option value="3 voyageur">3 voyageur</option>
                            </select>
                        </label>
                        <button type="Rechercher" class="bouton btn">Rechercher</button>
                        <!--le bouton est inclue dans le label "voyageur pour repondre au même élément" -->
                    </div>

            </div>
        </arcticle>

        <!--//AURELIA END// -->


    <!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    <!-- Latest compiled JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>