-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
120 lines (111 loc) · 5.46 KB
/
index.html
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
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>The Booleaner</title>
<link rel="stylesheet" href="./css/style.css">
</head>
<body>
<!-- header -->
<header>
<img class="logo" src="./img/logo.svg" alt="">
</header>
<!-- /header -->
<!-- main -->
<main>
<!-- Titolo dell'articolo con didascalia -->
<h1 class="titolo">Internet deve essere al servizio del "bene pubblico": il manifesto di Tim Berners-Lee</h1>
<div class="didascalia-autore">
Scritto da <span class="autore">The Booleaner</span> <br>
il 10/10/2020
</div>
<!-- immagini fondatore con didascalia -->
<div class="foto-autore">
<img src="./img/tim-1.jpg" alt="">
<img src="./img/tim-2.jpg" alt="">
<div>
1st Photo: Jhon S. and Jeams L. Knight Foundation, by Scott Henrichsen <br>
2nd Photo: Wikimedia, by Paul Clarke
</div>
</div>
<!-- inserimento paragrafo -->
<div>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laborum aperiam porro alias. Ratione, ab harum
explicabo labore illo assumenda asperiores accusantium, libero iste odit quaerat eum! Praesentium
repellat ut doloribus? Lorem ipsum <span class="evidenziare"> dolor sit amet consectetur adipisicing
elit</span>. Et quam maiores pariatur quas architecto inventore voluptatum doloribus, illum
aspernatur nulla maxime facilis ullam ut accusantium voluptatem tempore sed. Iure, accusantium.</p>
</div>
<!-- inserimento lista -->
<div>
<ul>
<li>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea ipsam asperiores, esse voluptas
obcaecati deleniti quibusdam quos placeat vitae, hic nostrum impedit et! Minus sint repellat,
veritatis sunt ullam molestias.</li>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quaerat vitae minima, nemo molestiae
praesentium incidunt quo alias at itaque laboriosam rerum reiciendis eos eveniet illo! Doloribus
ducimus aliquid aut libero!</li>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores quaerat debitis ut sunt odit et
aliquam id vero. Iusto facere quidem soluta voluptas officiis nostrum molestiae ex totam possimus
ipsum?</li>
</ul>
</div>
<!-- inserimento tabella -->
<div>
<table>
<thead>
<tr>
<th class="w-25">Lorem ipsum dolor</th>
<th class="w-25">Lorem ipsum dolor</th>
<th>Lorem ipsum dolor</th>
</tr>
</thead>
<tbody>
<tr class="sfondo-tabella">
<td>Lorem ipum dolor</td>
<td>Lorem ipum dolor</td>
<td>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quidem voluptatem laudantium
corporis! Harum sed eius consectetur eos nostrum molestias placeat enim et delectus,
asperiores praesentium maxime laborum architecto minima dolorum!</td>
</tr>
<tr>
<td>Lorem ipum dolor</td>
<td>Lorem ipum dolor</td>
<td>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sed quia minima nobis ab, saepe
mollitia cupiditate ducimus aspernatur voluptas cumque placeat animi veritatis tempore cum
ad maiores, temporibus iure perferendis.</td>
</tr>
<tr class="sfondo-tabella">
<td>Lorem ipum dolor</td>
<td>Lorem ipum dolor</td>
<td>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Officia cupiditate vero
doloremque, a quia perspiciatis sit porro distinctio veniam officiis ipsam aliquid.
Perspiciatis culpa, repudiandae dicta tempore voluptates error porro.</td>
</tr>
</tbody>
</table>
</div>
<!-- /fine tabella -->
<!-- inserimento paragrafo -->
<div>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dolore voluptatem nobis ab, eum laborum quod
repellendus. Nulla illo nisi similique harum incidunt asperiores, expedita, itaque vel laborum rerum
inventore Lorem ipsum dolor sit, amet consectetur adipisicing elit. <span class="evidenziare">Aliquid
facere consequuntur sint corporis alias provident dolore ad illum velit odit dignissimos at, porro
</span>asperiores eligendi dolor esse cumque perspiciatis quis.</p>
</div>
</main>
<!-- /main -->
<!-- footer -->
<footer>
<!-- inserimento interessi -->
<div>
<h2 class="didascalia-autore">Potrebbero interessarti</h2>
<h5 class="tim-1">Lorem ipsum dolor</h5>
<h5 class="tim-2">Lorem ipsum dolor</h5>
</div>
</footer>
<!-- /footer -->
</body>
</html>