-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
131 lines (118 loc) · 5.03 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
121
122
123
124
125
126
127
128
129
130
131
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>htmlmodulonotes</title>
</head>
<body>
<h1>sou h1</h1> <!-- "main titulo" cabecalho -->
<br> <!-- "line break" quebra de linha (serve para partir o texto em nova linha) -->
<hr> <!-- "horizontal rule" cria uma linha de separacao entre elementos -->
<h2>sou h2</h2> <!-- subtitulo -->
<h3>sou h3</h3> <!-- subsubtitulo -->
<h4>sou h4</h4>
<h5>sou h5</h5>
<h6>sou h6</h6>
<p>Lorem ipsum <i> dolor</i> <!-- italico --> sit amet <strong>consectetur </strong> <!-- negrito -->
elit. Sapiente excepturi ea quibusdam,laudantium quidem dicta aliquam itaque, culpa, voluptatum
ullam qui cupiditate soluta at velit tenetur incidunt! <mark> Quisquam </mark> <!--marca o texto como se fosse um marcador a marcar-->
rerum delectus.</p> <!-- paragrafo -->
<sub>180</sub>
<sup>200</sup>
<br>
<br>
<ins>200</ins>
<del>300</del>
<br>
<br>
<a href="https://google.com"> google webpage</a> <!-- links "hiperligacoes" -->
<br>
<a href="https://google.com" target="_blank">google</a> <!-- "_blank" abre o link numa nova tab" -->
<!--tag para desabilitar comentarios-->
<a href="/index.html" target="_blank"></a> <!--vai para a pasta que quero neste caso vai para o index.html-->
<img src="https://images.unsplash.com/photo-1718902101007-3151cc8c23f4?q=80&w=1031&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" width="500" alt="hhtp//:google.com">
<br>
<br>
<a href="https://www.facebook.com" target="_blank"> <img src="https://images.unsplash.com/photo-1718902433193-7c62552d2831?q=80&w=1031&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"width="500" title="imagem de um llama" alt="llama"></a> <!--imagem com link-->
<!--tag title e para os links e alt da texto ha imagem o title e quando falha o link aparece a traducao do que e -->
<img src="images/snowman.avif" width="400" alt="snowman" title="man in the snow">
<!-- se meter ../ volta para a pasta anterior e quanto mais ponho ../ mais volta para atras nas paginas para encontrar por exemplo a imagem-->
<ul> <!-- lista nao ordenada com pontos -->
<li>morangos</li>
<li>peras</li>
<li>laranjas</li>
<li>abacaxi</li>
</ul>
<ol> <!-- lista ordenada com numeros primeiro 1, 2 , 3 etc... -->
<li>porto</li>
<li>benfica</li>
<li>sporting</li>
<li>braga</li>
</ol>
<ul>
<li>azul</li>
<li>
amarelo
<ol>
<li>branco</li>
<li>laranja</li>
</ol>
</li>
<li>vermelho</li>
</ul>
<ul>
<li>
<a href="https://google.com"target="_blank">google</a>
</li>
<li>
<a href="https://facebook.com"target="_blank">facebook</a>
</li>
<ol>
<li>
<a href="https://tiktok.com"target="_blank">tiktok</a>
</li>
<li>
<a href="https://vodafone.com"target="_blank">vodafone</a>
</li>
</ol>
</ul>
<ol type="i" reversed> <!--lista ordenada por numeros romanos, reverse porque conta de cima para baixo-->
<li>azul</li>
<li>amarelo</li>
<li>vermelho</li>
</ol>
<ol start="5"> <!--comeca a contar a partir do 5-->
<li>laranja</li>
<li>branco</li>
<li>verde</li>
</ol>
<ol type="I" start="5"> <!--comeca a contar a partir do 5 em numeracao romana-->
<li>roxo</li>
<li>preto</li>
<li>cinza</li>
</ol>
<ul>
<li>morangos</li>
<li>ananas - <img src="https://images.unsplash.com/photo-1567088998094-df18063b98bd?q=80&w=1589&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"width=90" alt="abacaxi"></li>
<li>peras</li>
<li>laranjas</li>
<li>kiwi</li>
</ul>
<ol type="i">
<li>samsung</li>
<li>amazon</li>
<li>apple</li>
<li>google - <a href="https://google.com" target="_blank">google</a></li>
</ol>
<!--para videos-->
<video controls> <!-- tag "controls" dentro da tag video para aparecer os botoes de reproduzir, pause etc.. tag "auplay" dentro da tag video para comecar automatico mas so funciona se tiver mute ou tag "mute" para o video estar em silencio ou tag "loop" para nunca termianr o video e comecar automatico assim que chegar ao fim -->
<source src="httplink" type="video/mp4" >
flag video
</video>
<!--para audio--> <!--tem de ter a tag "controls" dentro do audio porque sem a tag "controls" nao aparece nada fica em branco-->
<audio controls src="" type="audio/mp4">
flag audio
</audio>
</body>
</html>