html-css-booleaner/index.html at main · StefanoDaniello/html-css-booleaner · 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
91
92
93
94
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>html-css-booleaner</title>
    <link rel="stylesheet" href="file.css">
</head>
<body>
    <header>
        <div class="container">
            <img  src="img/logo.svg" alt="">
        </div>
    </header>
    <main class="container">
       <section> <!-- Parte 1 -->
            <h1>internet deve essere al servizio del "bene pubblico": il <br>
            manifesto di Tim Berners-Lee </h1>
            <span class="opaco">Scritto da <span id="blue">The Booleaner</span></span>
            <br>
            <span class="opaco piccolo">il 10/10/2020</span>
            <br> <br>
            <img src="img/tim-1.jpg" alt="">
            <img src="img/tim-2.jpg" alt="">
            <br>
            <span>1st Photo: Jhon S. and James L.Knight Fundation, by Scott Hendrichsen</span>
            <br>
            <span>2st Photo: Widimedia,by Paul Clarke</span>
            <br><br>
       </section> <!-- Parte 2-->
       <section>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cumque laudantium dolores iusto vitae, molestiae quia
            est illo aspernatur adipisci quam voluptatibus incidunt vel aliquid minima modi similique exercitationem
             <mark>inventore necessitatibus asperiores blanditiis assumenda natus possimus ipsum!</mark>  Repudiandae,
            unde aperiam! Totam, et? Omnis itaque ipsa consectetur? Autem voluptates modi quisquam
            nostrum asperiores eos dolor nam voluptatibus non sequi doloribus laudantium ex maiores, accusamus provident
            consequatur nesciunt blanditiis sapiente laboriosam quaerat maxime?</p>
        <ul>
           <li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat doloribus nulla optio ducimus voluptatum
            sed ullam quisquam sit harum fugit!</li>
           <li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat doloribus nulla optio ducimus voluptatum
            sed ullam quisquam </li>
           <li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat doloribus nulla optio ducimus voluptatum
            sed ullam quisquam sit harum fugit!</li>
        </ul>
       </section>
       <section> <!-- Parte 3-->
        <table class="blue">
            <tr  class="white">
                <th>Lorem</th>
                <th class="centrale">Lorem</th>
                <th class="titolo">Lorem ipsum dolor</th>
            </tr>
        </table>
        <table class="lightblue ">
            <tr>
                <td>Lorem</td>
                <td class="centrale">Lorem</td>
                <td>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Veritatis, porro. Et iure itaque sunt
                    voluptatem nihil placeat est architecto culpa!fgdfgggttghjwrfhrefrbhjkfrbkhjfrwebjkfrbjkfrwbjk</td>
            </tr>
        </table>
        <table>
            <tr >
                <td>Lorem</td>
                <td class="centrale">Lorem</td>
                <td>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Veritatis, porro. Et iure itaque sunt
                    voluptatem nihil placeat est architecto culpa!fgdfgggttghjwrfhrefrbhjkfrbkhjfrwebjkfrbjkfrwbjk</td>
            </tr>
        </table>
        <table class="lightblue ">
            <tr>
                <td>Lorem</td>
                <td class="centrale">Lorem</td>
                <td>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Veritatis, porro. Et iure itaque sunt
                    voluptatem nihil placeat est architecto culpa!fgdfgggttghjwrfhrefrbhjkfrbkhjfrwebjkfrbjkfrwbjk</td>
            </tr>
        </table>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. At iure debitis recusandae. Tempora velit soluta, quos sint nihil minus, a expedita sed inventore voluptates laborum, dolorum cupiditate est? Deleniti nulla, eos quibusdam dolor maiores neque maxime adipisci quos tempore, aliquid ad laboriosam error possimus ullam perspiciatis rem dicta illo quasi distinctio quia necessitatibus doloremque optio.
                Amet dolore blanditiis voluptate voluptatem! <mark>Autem vero dolorum sit eos, amet ratione aperiam </mark> Autem vero dolorum sit eos, amet ratione aperiam doloremque dolore!</p>
       </section>
    </main>

    <aside class="container"> <!--Parte finale-->
        <p class="opaco">Potrebbero interessarti</p>
        <div><img src="img/monitor.jpg" alt=""><span>Lorem, ipsum dolor</span></div>
        <div><img src="img/graph.jpg" alt=""><span>Lorem, ipsum dolor</span></div>


    </aside>


</body>
</html>