Skip to content

C
css-e003
Switch branch/tag
Find file
Normal viewHistoryPermalink
Bootstrap.html 4.03 KB
Newer Older
tarea de bootstrap
0569bb4d
 
roshka committed
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 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Bootstrap</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="bootstrap.css">
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
</head>
<body>
    <div>
    <h2><strong>LOGOTIPO</h2></strong> 
    <p class="pull-right"> Buscar <input type="text" name="Buscar" id="Buscar"></p>
    </div>
    <div class="segundo">
        <a href="#">LoremIpsumDolorSitAmet</a>
    </div>
    <div class="col-md-2">
        <a href="#">Noticias</a><br>
        dd/mm/aaaa <a href="#">Lorem ipsum dolor sit amet</a> <br>
        dd/mm/aaaa <a href="#">Consectetuer adipiscing elit</a> <br>
        dd/mm/aaaa <a href="#">Donec molestie nunc eu sapien</a> <br>
        dd/mm/aaaa <a href="#">Maecenas aliquam dolor eget metus</a><br>
        dd/mm/aaaa <a href="#">Fusce tristique lorem id metus</a><br>
        <a href="#">Enlaces relacionados</a><br>
        <a href="#">Proin placerat</a><br>
        <a href="#">Nulla in felis</a><br>
        <a href="#">Nam luctus</a><br>
        <a href="#">Publicidad</a><br>
        Etiam fermentum, nisl tincidunt blandit  interdum, massa velit posuere
        dolor, sed euismod sem odio at mi.<br>
        Duis porta placerat arcu.<br>
        Nullam felis pede, commodo vel, suscipit a, molestie vel, felis. <br>
        Maecenas mattis est vel est. <br>
        <a href="#">Seguir leyendo...</a>
    </div>
        <div class="col-md-8">
            <img src="imagen.png" class="pull-left">
            <h3><strong>Lorem ipsum dolor sit amet, Consectetuer adipiscing elit</h3></strong>
            Nulla est lacus, suscipit ut, dapibus quis, 
            condimentum ac, risus. <br>Vivamus vestibulum, ipsum sollicitudin 
            faucibus pharetra, dolor metus fringilla dui, vel aliquet pede diam
            tempor tortor. <br>Vestibulum pulvinar urna et quam. Pellentesque habitant
            morbi tristique senectus et netus et malesuada fames ac turpis egestas. <br>
            Nullam vel turpis vitae dui imperdiet laoreet. Quisque eget ipsum.
            Donec commodo, turpis vel venenatis sollicitudin, quam ante convallis
            justo, sed eleifend justo lectus quis sapien. Ut consequat libero eget est. <br>
            <a href="#">Seguir leyendo...</a> <br><br><br>
            
            <img src="imagen.png" class="pull-left">
            <h3><strong>Vivamus lobortis turpis ac ante fringilla faucibius</h3></strong>
            Quisque eget ipsum. Donec commodo, turpis
            vel venenatis sollicitudin, quam ante convallis justo, sed eleifend
            justo lectus quis sapien. ut consequat libero eget est. <br>
            Cum sociis natoque penatibus et magnis dis parturient montes, nascetur
            ridiculus mus. Nullam dictum hendrerit neque. Mauris id ligula non elit 
            mattis semper. Fusce arcu ipsum, tempus eget, tincidunt at, imperdiet in, mi. <br>
            Sed fermentum cursus dolor. Aenean a diam. Phasellus feugiat. Donec tempor
            dignissim sem. <br>
            <a href="#">Seguir leyendo...</a>
        </div>
        <div class="col-md-2">
            <h3>Phasellus blandit</h3>
            Praesent sodales imperdiet augue. Mauris lorem felis, semper
            eu, tincidunt eu, sollicitudin eget, sem. Nulla facilisi. Morbi
            ut enim ut enim ultricies dapibus. <br>
            <a href="#">Seguir leyendo...</a>
            <h3>Nullam vel turpis</h3>
            Donec commodo, turpis vel venenatis sollicitudin, quam ante 
            convallis justo, sed eleifend justo lectus quis sapuen. Ut 
            consequat libero eget est. <br>
            <a href="#">Seguir leyendo...</a>
        </div>
    <div class="col-md-12">
        <a href="#">Nulla</a>|<a href="#">Pharetra</a>|<a href="#">Luctus</a>|
        <a href="#">Ipsum</a>|<a href="#">Proin</a>|<a href="#">Placerat</a>
        <span>© Copyright Lorem ipsum</span>
    </div>
</body>
</html>