English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Tutorial di base di HTML5

HTML5 API

HTML5 Media

HTML5 Grafica

Nuovi elementi HTML5

Le etichette semantiche e le proprietà di HTML5 permettono agli sviluppatori di implementare facilmente una layout di pagina web chiara, insieme alla rendering degli effetti di CSS3, rendendo semplice la creazione di pagine web ricche e flessibili.

Nuovi elementi HTML5

Dopo il 1999, HTML 4.01 è cambiato molto. Oggi, alcuni degli elementi di HTML 4.01 sono stati abbandonati e rimossi o ridefiniti in HTML5.

Per gestire meglio le applicazioni web di oggi, HTML5 ha aggiunto molti nuovi elementi e funzionalità, come: Disegno grafico, contenuti multimediali, migliore struttura delle pagine, migliore forma Gestione, e alcune api per trascinamento elementi, posizionamento, inclusi le pagine web Cache applicazione, archiviazione, worker di rete, ecc.

Nuovi elementi HTML5

  • <header>definisce la testa della pagina o dell'area;

  • <footer>definisce la parte finale della pagina o dell'area;

  • <nav>definisce una regione di navigazione della pagina o di un'area;

  • <section>definisce una regione logica della pagina o un insieme di contenuti;

  • <article>definisce il testo o un contenuto completo;

  • <aside>definisce contenuti supplementari o correlati;

Il tag di navigazione <nav>

<!doctype html><html><head>
<meta charset="UTF-8">
<title>Utilizzo del tag di navigazione HTML5</title>
</head>
<body>
<nav>
　　　　<ul>
　　　　　　　　<li><a href="#">Home</a></li>
　　　　　　　　<li><a href="#">Uno</a></li>
　　　　　　　　<li><a href="#">Due</a></li>
　　　　　　　　<li><a href="#">Tre</a></li>
　　　　</ul>
</nav>
</body></html>
Testa per vedere ‹/›

Implementazione del tag <header>

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Implementazione del tag <header> by it.oldtoolbag.com</title>
</head>
<body>
<header id="page_header">
　　　　<h1>Header</h1>
</header>
</body>
</html>
Testa per vedere ‹/›

Implementazione del tag <footer>

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Implementazione del tag <footer> by it.oldtoolbag.com</title>
</head>
<body>
Implementazione del tag <footer>
<footer id="page_footer">
　　　　<h2>Footer</h2>
</footer>
</body>
</html>
Testa per vedere ‹/›

<section> sezione e <article> articolo

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title><section> e <article> tag implementano by it.oldtoolbag.com</title>
</head>
<body>
L'etichetta <section> e <article> implementano
<section id="posts">
　　　　　　　　/*Può contenere più <article>*/
　　　　<article class="post">
　　　　　　　　　/*Contenuto dell'articolo*/
　　　　　　　　</article>
　　　　　　　　<article class="post">
　　　　　　　　　/*Contenuto dell'articolo*/
　　　　　　　　</article>
</section>
</body>
</html>
Testa per vedere ‹/›

Nuovo elemento <canvas>

EtichettaDescrizione
<canvas>L'etichetta definisce immagini grafiche, come grafici e altre immagini. Questo etichetta si basa sull'API di disegno JavaScript.

Nuovi elementi multimediali

EtichettaDescrizione
<audio>Definire il contenuto audio.
<video>Definire un video (video o movie).
<source>Definire risorse multimediali <video> e <audio>.
<embed>Definire il contenuto incorporato, come un plugin.
<track>Definire tracce testuali esterne per elementi come <video> e <audio>.

Nuovi elementi del modulo

EtichettaDescrizione
<datalist>Definire un elenco di opzioni. Utilizzare questo elemento con l'elemento input per definire i valori possibili dell'input.
<keygen>Stabilire il campo generatore di chiavi per il modulo.
<output>Definire diversi tipi di output, come l'output dello script.

Nuovi elementi semantici e strutturali

HTML5 offre nuovi elementi per creare una struttura di pagina migliore:

EtichettaDescrizione
<article>Definire un'area di contenuto indipendente della pagina.
<aside>Definire il contenuto della barra laterale della pagina.
<bdi>Permette di impostare un testo che si allinea indipendentemente dal direzione di testo del suo elemento padre.
<command>Definire un pulsante di comando, come un pulsante radio, un checkbox o un pulsante.
<details>Usato per descrivere i dettagli del documento o di una parte del documento.
<dialog>Definire una finestra di dialogo, come una finestra di avviso.
<summary>L'etichetta contiene il titolo dell'elemento details.
<figure>Stabilire un contenuto di flusso indipendente (immagini, grafici, foto, codice, ecc.).
<figcaption>Definire il titolo dell'elemento <figure>.
<footer>Definire il piè di pagina della section o del documento.
<header>Definire l'area di testa del documento.
<mark>Definire il testo con un simbolo.
<meter>Definire le unità di misura. Utilizzate solo per le misure con valori massimi e minimi noti.
<nav>Definire una parte di collegamento di navigazione.
<progress>Definire il progresso di qualsiasi tipo di compito.
<ruby>Definire i commenti ruby (ortografia cinese o carattere).
<rt>Definire l'interpretazione o l'pronuncia di un carattere (ortografia cinese o carattere).
<rp>Utilizzato in commenti ruby, definisce il contenuto visualizzato dai browser che non supportano i elementi ruby.
<section>Definire una sezione (section, sezione) nel documento.
<time>Definire una data o un'ora.
<wbr>Specificare dove è appropriato aggiungere un'interruzione di riga nel testo.

Elementi rimossi

I seguenti elementi HTML 4.01 sono stati rimossi dall'HTML5:

  • <acronym>

  • <applet>

  • <basefont>

  • <big>

  • <center>

  • <dir>

  • <font>

  • <frame>

  • <frameset>

  • <noframes>

  • <strike>

  • <tt>

SVG inline HTML5Supporto dei browser HTML5