Utilizzo di uno scheletro HTML
Uno scheletro è la struttura portante di un organismo.
Di solito è fatto di qualcosa di duro, per proteggere un corpo più vulnerabile.
Enciclopedia
Ogni sviluppatore Web dovrebbe avere uno scheletro HTML.
Va tenuto in tasca, e utilizzato per ogni lavoro:
Esempio
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Page Title</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="">
<style>
</style>
<script src=""></script>
<body>
<img src="img_la.jpg" alt="LA" style="width:100%">
<div class="">
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</div>
</body>
</html>
Clicca sul pulsante "Provalo tu stesso" per vedere come funziona!
Prova a cambiare il testo "Questa è un'intestazione" in "Questo è il mio matrimonio".
Ce l'hai fatta?
Congratulazioni! Ora sai come modificare l'HTML.
Spiegazione dello scheletro HTML
Il DOCTYPE deve essere presente. Informa il browser che questo è un documento HTML:
<!DOCTYPE html>
Un tag di inizio html e un tag di fine html definiscono l'inizio e la fine di un documento HTML.
La lingua è l'inglese:
<html lang="en">
</html>
Un meta tag charset definisce il set di caratteri (UTF-8):
Nella pagina HTML mancano i tag head. I tag Head non sono necessari in HTML.
In HTML, tutto ciò che precede il tag body è considerato una parte della testa.
<meta charset="UTF-8">
Lo standard HTML richiede un titolo di pagina corretto:
<title>Page Title</title>
Un tag meta viewport rende la pagina bella su tutte le dimensioni dello schermo (laptop, mobile):
<meta name="viewport" content="width=device-width,initial-scale=1">
Il tag link si collega a un foglio di stile:
<link rel="stylesheet" href="name">
Il tag di inizio e il tag di fine circondano il futuro stile CSS:
<style>
</style>
Il tag script si collega a uno script:
<script src="name"></script>
Il tag di inizio e il tag di fine circondano il corpo visibile del documento HTML:
<body>
</body>
I tag immagine definiscono le immagini HTML:
<img src="img_la.jpg" alt="LA" style="width:100%">
Prendi l'abitudine di "comprimere" le sezioni HTML negli elementi div.
Preparati a dare a ogni sezione un nome di classe:
<div class="class name">
</div>
I tag di intestazione definiscono le intestazioni HTML:
<h1>This is a Heading</h1>
I tag di paragrafo definiscono i paragrafi HTML:
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>