W3docs

Tag HTML <dir>

Il tag <dir> era usato per elencare titoli di directory. È obsoleto in HTML5. Scopri cosa usare al suo posto.

Pericolo

Il tag <dir> è obsoleto. È un tag HTML deprecato che è stato rimosso dallo standard e non è supportato in HTML5. Non usarlo nelle nuove pagine. Usa il tag <ul> insieme alla proprietà CSS list-style — vedi la sostituzione moderna di seguito.

Il tag <dir> era storicamente usato per definire un elenco di titoli di directory — nomi brevi di file o cartelle. Gli elementi all'interno dell'elenco erano definiti con il tag <li>, esattamente come in un elenco non ordinato, e venivano visualizzati con punti elenco per impostazione predefinita.

Perché <dir> è stato deprecato

<dir> è stato rimosso dallo standard per diversi motivi:

  • Sovrapponeva completamente <ul>. I browser rendevano <dir> allo stesso modo di un elenco puntato <ul>, quindi non aggiungeva alcun comportamento proprio.
  • Non aveva un reale valore semantico. "Un elenco di titoli di directory" non è una distinzione significativa nell'HTML moderno. Un semplice elenco non ordinato comunica già "un elenco di elementi", quindi un elemento separato era ridondante.
  • La sua implementazione era incoerente. L'attributo compact, pensato per rendere l'elenco più compatto, veniva gestito in modo diverso tra i browser (e spesso ignorato del tutto), rendendo l'elemento inaffidabile.

Poiché duplicava <ul> senza offrire nulla in più, la specifica HTML ha deprecato <dir> e ora definisce <ul> come l'elemento corretto per qualsiasi elenco piatto di elementi.

La sostituzione moderna: <ul>

Sostituisci <dir> con un elenco non ordinato standard. Otterrai un markup identico — elementi <li> all'interno di un genitore — ma con pieno supporto HTML5 e controllo completo sui punti elenco tramite la proprietà CSS list-style.

Il punto elenco predefinito per un <ul> è disc (un cerchio pieno), quindi la cosa più utile che CSS offre è la possibilità di cambiarlo. I valori di list-style-type seguenti sono le alternative più comuni:

  • none — rimuove completamente i punti elenco (usato per menu di navigazione ed elenchi con stile personalizzato).
  • square — un quadrato pieno.
  • circle — un cerchio vuoto (con solo il contorno).
<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .none   { list-style-type: none; }
      .square { list-style-type: square; }
      .circle { list-style-type: circle; }
    </style>
  </head>
  <body>
    <ul class="none">
      <li>HTML Tutorial</li>
      <li>CSS Tutorial</li>
    </ul>
    <ul class="square">
      <li>HTML Tutorial</li>
      <li>CSS Tutorial</li>
    </ul>
    <ul class="circle">
      <li>HTML Tutorial</li>
      <li>CSS Tutorial</li>
    </ul>
  </body>
</html>

Per saperne di più sulla creazione e la formattazione degli elenchi, consulta la panoramica sugli elenchi HTML, i tag <ul> e <ol>, e la proprietà CSS list-style.

Sintassi (legacy)

Solo per riferimento — il tag <dir> era usato in coppie, con i suoi elementi <li> scritti tra il tag di apertura (<dir>) e quello di chiusura (</dir>).

<dir>
  <li>HTML Tutorial</li>
  <li>CSS Tutorial</li>
  <li>PHP Tutorial</li>
</dir>

Attributi

AttributoValoreDescrizione
compactcompactSpecifica che l'elenco deve essere visualizzato in modo più compatto del normale. Non supportato in HTML5.

Il tag <dir> supporta anche gli Attributi Globali e gli Attributi Evento.

Esercitati

Pratica
A cosa serviva l'elemento HTML 'dir'?
A cosa serviva l'elemento HTML 'dir'?
Was this page helpful?