Sezioni e articoli
Fa parte della sezione Fondamenti del percorso HTML di Coddy. Lezione 28 di 60.
In HTML, i tag <section> e <article> vengono usati per organizzare i contenuti in parti logiche.
Il tag <section> definisce una sezione in un documento, come capitoli, intestazioni, piè di pagina o altre sezioni del documento. È un modo per raggruppare contenuti correlati. Per esempio, potresti usare <section> per suddividere una pagina in introduzione, contenuto e informazioni di contatto.
Ecco come puoi usare il tag <section>:
<section>
<h2>Section Heading</h2>
<p>Section content goes here.</p>
</section>Il tag <article> specifica contenuti indipendenti e autonomi. Dovrebbe avere senso di per sé e dovrebbe essere possibile leggerlo indipendentemente dal resto del sito web. Esempi di utilizzo di un elemento <article>: un post su un forum, un articolo di blog, una notizia o un commento.
Ecco come puoi usare il tag <article>:
<article>
<h2>Article Title</h2>
<p>Article content goes here.</p>
</article>
Sfida
FacileCrea un documento HTML che utilizzi i tag <section> e <article> per strutturare una pagina web. Includi le seguenti sezioni:
- Una sezione
<main>che contenga il contenuto principale della pagina. - All'interno di
<main>, crea un<section>con un'intestazione (<h2>) che dica "Upcoming Events". - All'interno di
<section>, crea due elementi<article>. - Ogni
<article>dovrebbe avere un'intestazione (<h3>) e un paragrafo (<p>) con del testo segnaposto. Usa "Event 1" e "Event 2" per le intestazioni e "Event 1 details..." e "Event 2 details..." per i paragrafi.
Provalo tu
<!DOCTYPE html>
<html>
<body>
<!-- Scrivi il codice qui -->
</body>
</html>
Mettiti alla provaQuesta lezione include un breve quiz. Inizia la lezione per rispondere e tenere traccia dei tuoi progressi.
Tutte le lezioni di Fondamenti
1Fondamenti di HTML
Che cos’è HTML?Struttura di base di un documento HTMLTag ed elementiAnnidamento e tag di chiusuraCommenti in HTML7Pagina del profilo personale
Panoramica del progettoSezione intestazione
Immagine del profiloSezione Chi sonoLink ai social2Testo e formattazione
IntestazioniParagrafiInterruzioni di rigaTesto in grassetto e corsivoAncora grassetto e corsivoRiepilogo - formattazione5Aggiungere contenuti
Attributi HTMLCollegamentiCollegamenti a nuove pagineImmaginiAttributi delle immagini8Moduli e campi di input - Parte 1
Nozioni di base sui moduliCampi di testoAttributi degli inputCampo passwordEtichette per gli inputRiepilogo - modulo di base11Pagina di registrazione all'evento
Panoramica del progettoSezione intestazioneSezione dettagli dell'eventoModulo di registrazioneSezione piè di paginaEsercitati da solo: Playground Web