Informatica

Fondamenti di Sviluppo Web

HTML

Informatica1,254 views·Updated Jun 24, 2026·5 pages

Guida HTML: Crea il Tuo Sito Web da Zero

charanjot singh@charanjotsingh_cbng

Add to Google sources

L'HTML è un metalinguaggio di markup che permette di creare...

1 / 5

of 5

<h1>, <h2>, <h3>, <h4>, <h5>, <h6>

<body>
<h1>Titolo della pagina...</h1>
<h2>Sottotitolo della pagina...</h2>
</body>

<p>
<p align=right>

Fondamenti di HTML

L'HTML è un metalinguaggio di markup che consente di descrivere come i contenuti devono essere visualizzati nei browser. I suoi elementi principali sono i tag, etichette racchiuse tra parentesi angolari (< >) che definiscono le caratteristiche degli elementi da mostrare.

Un tag è generalmente composto da una parte di apertura e una di chiusura (esempio: <h1>Titolo</h1>). I tag possono essere annidati uno dentro l'altro e possono contenere attributi che ne modificano il comportamento o l'aspetto.

I tag fondamentali della struttura HTML includono <!DOCTYPE> che definisce il tipo di documento, <html> che segna l'inizio del documento, <head> che contiene informazioni sull'intestazione non visibili all'utente, e <body> che definisce il corpo principale della pagina.

💡 Ricorda che l'HTML non è "case sensitive": puoi scrivere i tag sia in maiuscolo che in minuscolo e funzioneranno allo stesso modo!

Il tag <body> può contenere attributi importanti come bgcolor per definire il colore dello sfondo, background per impostare un'immagine di sfondo, text per il colore del testo e link per il colore dei collegamenti.

of 5

Tag di Formattazione del Testo

I tag da <h1> a <h6> definiscono le intestazioni HTML di diversi livelli, dove <h1> ha la dimensione massima e <h6> la minima. Sono perfetti per strutturare i contenuti della tua pagina in modo gerarchico.

Il tag <p> crea paragrafi e può usare l'attributo align per allineare il testo a destra, sinistra o al centro. Altri tag utili sono <br> che genera un ritorno a capo e <hr> che inserisce una linea orizzontale nella pagina.

Per modificare lo stile del testo, puoi usare <b> per il grassetto, <i> per il corsivo e <u> per il sottolineato. Puoi anche inserire commenti invisibili nel codice con .

🎨 I colori in HTML possono essere definiti in tre modi: con il nome ("red"), in formato RGB (255,0,0), o in esadecimale (#FF0000).

Il tag <img> permette di inserire immagini e accetta molti attributi come src (percorso dell'immagine), width e height (dimensioni), alt (descrizione alternativa) e border (bordo dell'immagine).

of 5

Immagini e Collegamenti

Le immagini possono essere posizionate rispetto al testo usando l'attributo align con valori come "left" o "right". Gli attributi hspace e vspace controllano la distanza orizzontale e verticale tra l'immagine e gli altri elementi.

Quando usi l'attributo src di un'immagine, puoi specificare il percorso in modo assoluto (partendo dalla radice con uno slash) o relativo (partendo dalla directory corrente). La scelta dipende da come organizzi i file del tuo sito.

I collegamenti ipertestuali si creano con il tag <a> e l'attributo href che specifica l'URL di destinazione. Puoi creare link verso altre pagine, immagini, PDF o qualsiasi tipo di file. L'attributo title mostra un'etichetta quando si passa sopra il link con il mouse.

🔍 Le ancore sono collegamenti speciali che permettono di saltare a punti specifici della stessa pagina. Si creano con <a name="punto"> e si utilizzano con <a href="#punto">.

Per trasformare un'immagine in un collegamento, devi semplicemente annidare il tag <img> all'interno di un tag <a>. Così gli utenti potranno cliccare sull'immagine per essere reindirizzati.

of 5

Elenchi e Tabelle

Gli elenchi non ordinati si creano con il tag <ul> e mostrano elementi preceduti da pallini o altri simboli. Puoi scegliere il tipo di simbolo con l'attributo type (disc, square, circle). Ogni elemento dell'elenco va inserito nel tag <li>.

Gli elenchi ordinati si creano con <ol> e mostrano elementi numerati in sequenza. Puoi personalizzare il tipo di numerazione con l'attributo type (numeri, lettere o numeri romani) e scegliere da dove iniziare con l'attributo start.

Il tag <font> ti permette di modificare l'aspetto del testo. Puoi cambiare il tipo di carattere con face, la dimensione con size (da 1 a 7) e il colore con color. È un modo semplice per dare stile ai tuoi testi.

📊 Le tabelle sono fondamentali per organizzare i dati in modo chiaro e ordinato. Ricorda che prima crei la tabella, poi le righe e infine le celle.

Le tabelle si creano con il tag <table> che può includere un bordo con l'attributo border. All'interno vanno definite le righe con <tr>, le celle normali con <td> e le celle di intestazione con <th>. Puoi controllare larghezza e allineamento della tabella con gli attributi width e align.

of 5

Tabelle Avanzate

Le tabelle possono essere personalizzate per creare layout più complessi unendo celle sia in orizzontale che in verticale. Questo ti permette di creare strutture adatte a presentare i tuoi dati in modo più efficace.

Per unire celle adiacenti sulla stessa riga, usa l'attributo colspan nelle celle <td>. Il valore numerico indica quante celle devono essere unite. Per esempio, <td colspan="2"> unisce due celle orizzontalmente.

Per unire celle in verticale (sulla stessa colonna), usa l'attributo rowspan. Ad esempio, <td rowspan="2"> estenderà quella cella per occupare due righe verso il basso.

🔧 Puoi personalizzare ulteriormente le celle della tabella con gli attributi width (larghezza), height (altezza) e align (allineamento) per controllare con precisione come appaiono i contenuti.

Combinando colspan e rowspan puoi creare layout di tabella complessi per presentare dati o strutturare le tue pagine. Ricorda che quando usi questi attributi, devi omettere le celle che vengono unite nella struttura della tabella.

We thought you’d never ask...

What is the Knowunity AI companion?

Our AI companion is specifically built for the needs of students. Based on the millions of content pieces we have on the platform we can provide truly meaningful and relevant answers to students. But its not only about answers, the companion is even more about guiding students through their daily learning challenges, with personalised study plans, quizzes or content pieces in the chat and 100% personalisation based on the students skills and developments.

Where can I download the Knowunity app?

You can download the app in the Google Play Store and in the Apple App Store.

Is Knowunity really free of charge?

That's right! Enjoy free access to study content, connect with fellow students, and get instant help – all at your fingertips.

Most popular content in Informatica

Informatica

Stranger Things

Quanto Ne Sai Sulla Fantastica Serie Netflix Stranger Things??

1ªm6309

Informatica

Segnali integrativi

Appunti patente

3ªl2,51158

Informatica

Diagrammi di flusso

Appunti per ripasso dei diagrammi di flusso (flowchart); Introduzione ai blocchi, condizione e iterazioni (WHILE e DO WHILE);

1ªl2,27840

Informatica

Programmazione in C

Appunti chiave per programmare in C

1ªl1,99570

Informatica

il romanico

elementi del romantico

2ªm2,943100

Informatica

EXCEL

riferimenti, funzioni (SE, CONTA.SE, CONFRONTA, CERCA.VERT, SOMMA.SE, MAX e MIN, E), copia e incolla, riempimento automatico, subtotali

1ªl2,87384

Informatica

Composti chimici inorganici

Composti chimici inorganici + nomenclatura

1ªl1,27746

Informatica

Informatica 1

Primi argomenti di informatica della prima superiore, Architettura di VON NEUMANN, Hardware software, Il case e la scheda madre, Periferiche e schede e porte di comunicazione, l’unità centrale di elaborazione e la memoria centrale, la memoria RAM…..

1ªl69028

Informatica

reti informatiche

le reti informatiche, cosa sono, come funzionano e le sue caratteristiche

5ªl3,07662

Most popular content

Italiano

Riassunto patente B

Riassunto patente B - appunti presi a lezione

5ªl29,242943

Altro

Teoria patente b

Tutti gli argomenti per la patente

1ªl21,138685

Ed. civ.

Teoria patente di guida B: Segnali stradali

Segnali stradali di pericolo, luminosi, di prescrizione, di indicazione, temporanei, complementari, pannelli integrativi, segnaletica orizzontale, segnalazioni agenti del traffico, distanza di visibilità per l‘arresto, minima di sicurezza.

5ªl40,0421,645

Filosofia

Aristotele

Aristotele: vita, metafisica, fisica, etica e politica, retorica e poetica

3ªl7,623216

Italiano

I promessi sposi

Riassunti completi di tutti i 38 capitoli dei Promessi sposi.

2ªl14,090314

Altro

PATENTE

schemi per esame teorico della patente

Università22,067756

Italiano

Sintesi finale di Analisi logica

Esercitazione completa di analisi logica su frasi articolate per consolidare la conoscenza di tutti i complementi.

3ªm5,5290

Inglese

Present Simple vs Present Continuous

Develop the ability to choose correctly between the Present Simple for habits and the Present Continuous for ongoing actions.

3ªm4,2120

Italiano

Gabriele D'Annunzio e l'Estetismo

Domande sull'ideale del superuomo, il panismo e la concezione dell'arte come valore assoluto in D'Annunzio.

4ªl2,6740

Can't find what you're looking for? Explore other subjects.

Students love us — and so will you.

4.6/5App Store

4.7/5Google Play

The app is very easy to use and well designed. I have found everything I was looking for so far and have been able to learn a lot from the presentations! I will definitely use the app for a class assignment! And of course it also helps a lot as an inspiration.

Stefan SiOS user

This app is really great. There are so many study notes and help [...]. My problem subject is French, for example, and the app has so many options for help. Thanks to this app, I have improved my French. I would recommend it to anyone.

Samantha KlichAndroid user

Wow, I am really amazed. I just tried the app because I've seen it advertised many times and was absolutely stunned. This app is THE HELP you want for school and above all, it offers so many things, such as workouts and fact sheets, which have been VERY helpful to me personally.

AnnaiOS user

Informatica

Fondamenti di Sviluppo Web

HTML

Informatica1,254 views·Updated Jun 24, 2026·5 pages

Guida HTML: Crea il Tuo Sito Web da Zero

charanjot singh@charanjotsingh_cbng

Add to Google sources

L'HTML è un metalinguaggio di markup che permette di creare pagine web statiche attraverso l'uso di tag. A differenza dei linguaggi di programmazione, che creano pagine dinamiche, l'HTML si concentra sulla struttura e la presentazione dei contenuti sul web.

of 5

Fondamenti di HTML

💡 Ricorda che l'HTML non è "case sensitive": puoi scrivere i tag sia in maiuscolo che in minuscolo e funzioneranno allo stesso modo!

of 5

Tag di Formattazione del Testo

🎨 I colori in HTML possono essere definiti in tre modi: con il nome ("red"), in formato RGB (255,0,0), o in esadecimale (#FF0000).

of 5

Immagini e Collegamenti

🔍 Le ancore sono collegamenti speciali che permettono di saltare a punti specifici della stessa pagina. Si creano con <a name="punto"> e si utilizzano con <a href="#punto">.

Per trasformare un'immagine in un collegamento, devi semplicemente annidare il tag <img> all'interno di un tag <a>. Così gli utenti potranno cliccare sull'immagine per essere reindirizzati.

of 5

Elenchi e Tabelle

📊 Le tabelle sono fondamentali per organizzare i dati in modo chiaro e ordinato. Ricorda che prima crei la tabella, poi le righe e infine le celle.

of 5

Tabelle Avanzate

Per unire celle in verticale (sulla stessa colonna), usa l'attributo rowspan. Ad esempio, <td rowspan="2"> estenderà quella cella per occupare due righe verso il basso.

🔧 Puoi personalizzare ulteriormente le celle della tabella con gli attributi width (larghezza), height (altezza) e align (allineamento) per controllare con precisione come appaiono i contenuti.