bootstrap_workshop/index.html at master · aric87/bootstrap_workshop · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Learning Bootstrap</title>
    <link rel="stylesheet" href="bower_components/normalize.css/normalize.css"/>
    <link rel="stylesheet" href="css/style.css"/>

</head>
<body>
<header>
    <nav>
        <a href="">Home</a>
        <a href="">Away</a>
        <a href="">My page</a>
        <a href="">Contact</a>
        <a href="">Login</a>
    </nav>
    <img src="https://images.unsplash.com/photo-1437941792454-bacef7a7f736?q80&fmjpg&s9d54a5c69d3ae8ba1af0554649c24aa8"
         alt="background image of water" class="masthead"/>
    <h1>Learning Bootstrap Layouts</h1>
</header>
<section>
    <article>
        <h2>Check out this awesome block of text</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid delectus distinctio dolor eum explicabo id ipsam itaque labore, laboriosam maiores modi nemo nostrum officia provident quia repudiandae suscipit tenetur voluptates.</p>
    </article>
    <article>
        <h2>Block 2 is just for you</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum dolor id iste nesciunt odit, sapiente similique? A debitis deleniti deserunt dolore eos officia perspiciatis quibusdam? Consequatur labore mollitia qui repellat?</p>
    </article>
    <article>
        <h2>Block three is never free</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad at cupiditate dolorem ea earum error explicabo labore quia saepe vero? Ab cupiditate debitis in laborum necessitatibus perferendis repudiandae similique unde?</p>
    </article>
</section>
<form >
    <label for="exampleInputName2">Name</label>
    <input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">
    <label for="exampleInputEmail2">Email</label>
    <input type="email" class="form-control" id="exampleInputEmail2" placeholder="jane.doe@example.com">
    <button type="submit" >Send invitation</button>
</form>
<footer>
    <nav>
        <a href="">Home</a>
        <a href="">Away</a>
        <a href="">Contact</a>
        <a href="">Login</a>
    </nav>
    <p>Copyright 2015 Some company with cool copyright message</p>
</footer>
<script src="js/custom.js"></script>
</body>
</html>