Logo
Banner Informatica

Elenchi e testo in HTML

Per gestire il testo si usano generalmente i seguenti tag

Ecco i principali tag per delimitare il testo:
<p>
individua l'apertura di un nuovo paragrafo
<div>
individua l'apertura di un nuovo blocco di testo
<span>
individua l'apertura di un elemento di testo inline

Ecco i tag per grassetto, sottolineato e corsivo:
<b>Testo in grassetto</b>
<u>Testo sottolineato</u>
<i>Testo in corsivo</i>

Per gestire gli elenchi invece si usano:

Elenchi puntati

<ul>
	<li>primo elemento</li>
	<li>secondo elemento</li>
	<li>terzo elemento</li>
</ul>

Elenchi puntati indentati

<ul>
	<li>primo della 1a lista</li>
	<li>secondo della 1a lista
		<ul>
			<li>primo della 2a lista</li>
			<li>secondo della 2a lista
				<ul>
					<li>primo della 3a lista</li>
				</ul>
			</li>
			<li>terzo della 2a lista</li>
		</ul>
	</li>
</ul>

Elenchi numerati

  1. primo elemento
  2. secondo elemento
  3. terzo elemento
<ol>
	<li>primo elemento</li>
	<li>secondo elemento</li>
	<li>terzo elemento</li>
</ol>

Elenchi numerati indentati

  1. Primo livello
    1. Secondo livello
      1. Terzo livello
      2. Terzo livello
    2. Secondo livello
  2. Primo livello
<ol type="1"><!-- numeri -->
	<li>Primo livello
		<ol type="a"><!-- lettere -->
			<li>Secondo livello
				<ol type="I"><!-- numeri romani -->
					<li>Terzo livello</li>
					<li>Terzo livello</li>
				</ol>
			</li>
			<li>Secondo livello</li>
		</ol>
	</li>
	<li>Primo livello</li>
</ol>

Elenchi numerati con partenze diverse

  1. elemento
  2. elemento
  3. elemento
  4. elemento
<ol start="10">
	<li>elemento</li>
	<li>elemento</li>
	<!-- da questo punto in poi contiamo a partire da 30 -->
	<li value="30">elemento</li>
	<li>elemento</li>
</ol>

Indentazione del testo

Un livello di indentazione
Due livelli di indentazione
Un livello di indentazione
Due livelli di indentazione
<dl>
	<dt>Un livello di indentazione</dt>
		<dd>Due livelli di indentazione</dd>
	<dt>Un livello di indentazione</dt>
		<dd>Due livelli di indentazione</dd>
</dl>

Es HTML liste      Es HTML liste su JSFiddle

Torna all'indice