I tag<h1>/<h6> e <p>
I tag da <h1> a <h6> definiscono dei titoli. Il numero rappresenta il livello di importanza del titolo. Ogni titolo inizia una nuova riga. Di default è reso dai browser come testo in grassetto di dimensione proporzionale all'importanza.
<h1>Questo è un titolo molto importante</h1>
<h2>Questo è un titolo meno importante</h2>
<h3>Questo è un titolo ancora meno importante</h3>
<h4>Questo è un titolo poco importante</h4>
<h5>Questo è un titolo davvero poco importante</h5>
<h6>Questo è il titolo meno importante di tutti</h6>Il tag <p> rappresenta un paragrafo. Ogni paragrafo inizia una nuova riga.
<p>Questo è un paragrafo.</p>
<p>Questo è un altro paragrafo su una nuova riga.</p>I tag <br> e <span>
Il tag <br> serve per marcare una interruzione di riga. È un elemento vuoto, quindi privo di chiusura. Può essere scritto come <br> o <br />.
<p>Questo è un paragrafo.</p>
<br> <!-- questo <br> è inutile perchè ogni paragrafo inizia una nuova riga -->
<p>Questo è un altro <br> paragrafo.</p> <!-- Il browser visualizzerà la parola paragrafo su una nuova riga-->Il tag <span> è un elemento privo di significato semantico e serve per applicare attributi o formattazioni particolari ad alcune parti di testo.
<p>Il mio piatto preferito è il <span lang="es">burrito</span>.</p>I tag <strong> e <em>
Il tag <strong> definisce un testo più importante rispetto al resto della frase. Uno <strong> può essere contenuto dentro un altro <strong> per denotare diversi livelli di importanza. Di default è reso dai browser in grassetto.
<!-- l'intera frase è marcata come importante mentre la parola "molto" è marcata come doppiamente importante-->
<p><strong>Si prega di proteggersi gli occhi indossando un paio di occhiali <strong>molto</strong> scuri per osservare l'eclissi solare.</strong></p>Il tag <em> serve per indicare un testo enfatizzato, cioè pronunciato con un tono di voce diverso rispetto al resto della frase. Un <em> può essere contenuto dentro un altro <em> per denotare diversi livelli di enfasi. Di default è reso dai browser in corsivo.
<p>Come mai hai lasciato il tuo fidanzato?</p>
<p>No, <em>lui</em> ha lasciato me!</p>Ci sono altri due tag che in passato erano usati come <strong> e <em> ma che sono stati ridefiniti nell'HTML5: <b> e <i>.
Il tag <b> rappresenta una parte di testo sulla quale si richiama l’attenzione ma senza che questo abbia una valenza semantica, mentre il tag <i> indica un testo che deve essere inteso con una voce o un umore diversi, ma anche qui senza dargli un significato particolare.
<b> e <em> sono usati raramente, solo nel caso in cui nessuno degli altri tag sia più appropriato.
I tag <blockquote>, <q> e <cite>
Il tag <blockquote> rappresenta una citazione di una certa lunghezza, autonoma rispetto al resto del testo. Una citazione molto lunga può essere divisa in titoli e paragrafi. Di default è reso dai browser su una nuova riga rientrata a sinistra. Per indicare la fonte della citazione si usa l'attributo cite (da non confondere con il tag <cite>). Nel caso in cui la citazione sia in una lingua diversa dal resto del testo è bene inserire l'attributo lang nel tag <blockquote>.
<p>Ecco il discorso di Nathan Young nell'ultima puntata della prima stagione di <cite>Misfits</cite></p>
<!-- il contenuto dell'attributo cite non viene visualizzato dal browser -->
<blockquote cite="https://www.youtube.com/watch?v=NCL2bqqwDQ8">
<p>Lei vi ha fatto credere che dovreste essere così, ma non è vero. Siamo giovani! E' normale per noi bere troppo. E' normale per noi comportarci male e scopare come scimmie!</p>
<p>Il nostro compito è divertirci! Ecco la verità! E sì, alcuni di noi andranno in overdose o impazziranno, ma Charles Darwin ha detto "La frittata non si può fare senza rompere delle uova" ed è di questo che sto parlando. Rompere delle uova! E con questo intendo... farsi come delle zucchine con tutte le droghe possibili.</p>
<p>Dio, se poteste vedervi ora! Mi si spezza il cuore. Indossate dei cardigan! Noi avevamo tutto! Abbiamo mandato a puttane tutto, più e meglio delle generazioni che ci hanno preceduti. Noi eravamo davvero bellissimi!</p>
<p>Siamo dei cazzoni. Io sono un cazzone e voglio essere un cazzone fino alla fine dei miei vent'anni, magari fino all'inizio dei trenta! E sono pronto a farmi mia madre, prima di lasciare che lei o chiunque altro, mi porti via tutto questo!</p>
</blockquote>Il tag <q> rappresenta una citazione breve all’interno di una frase, non più lunga di un paragrafo. Di default è reso dai browser come testo racchiuso tra virgolette. Per indicare la fonte della citazione si usa l'attributo cite (da non confondere con il tag <cite>). Nel caso in cui la citazione sia in una lingua diversa dal resto del testo è bene inserire l'attributo lang nel tag <q>.
<p>Ieri ho sentito la barzelletta più bella del mondo:
<q cite="https://www.youtube.com/watch?v=1Y7EjQsvmBs">Tre pomodori camminano per la strada. Papà pomodoro, mamma pomodoro e il pomodorino. Il pomodorino cammina con aria svagata e papà pomodoro allora si arrabbia e va da lui, lo schiaccia e dice: «Fai il concentrato!».</q>
</p>Il tag <cite> serve per indicare il riferimento ad una fonte, ad ex il titolo di un film o un libro. Il nome della persona che ha pronunciato la citazione non viene considerato una fonte. Con <cite> si indica solo la fonte, non il materiale citato, che va compreso in un <blockquote> o un <q>. Di default è reso dai browser in corsivo.
<p>Una delle mie citazioni preferite proviene dal telefilm <cite>Lost</cite> e la pronuncia John Locke: <q>Non confondere la coincidenza con il destino.</q></p>I tag <code> e <pre>
Il tag <code> definisce uno snippet di codice o il nome di un file. Ciò che viene inserito dentro il tag <code> non viene interpretato dal browser ma viene reso a video nello stesso modo in cui è stato scritto. Di default è reso dai browser in font monospaziato.
<p>Ecco il mio primo programma in Java!
<pre><code>
public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello, World");
}
}
</code></pre>
</p>Il tag <pre> definisce un testo che deve essere visualizzato dal browser esattamente nel modo in cui è stato inserito nel codice, rispettando tutti gli spazi e gli a capo che di solito vengono eliminati. E’ utilizzato per realizzare la ASCII art! Può contenere un tag <code> quando stiamo rappresentando del codice.
All’interno del tag <pre> è disattivato l’a capo automatico, quindi una riga troppo lunga comporta la comparsa della barra di scorrimento orizzontale. Di default è reso dai browser con un font monospaziato.
,d88b.d88b,
88888888888
`Y8888888Y'
`Y888Y'
`Y' I tag <ins>, <del> e <s>
Il tag <ins> definisce un testo che è stato aggiunto in seguito. Può contenere al suo interno altri tag come paragrafi o liste. Di default è reso dai browser come testo sottolineato. <ins> supporta gli attributi cite (fornisce la fonte che spiega il motivo della modifica) e datetime (fornisce l’ora della modifica).
<p>I personaggi usciti dal cast di <cite>The Walking Dead</cite>:</p>
<ul>
<li>Shane</li>
<li>Dale</li>
<li>Hershel</li>
<li>Merle</li>
<li>Il Governatore</li>
<li><ins>Bob</ins></li>
<li><ins>Tyreese</ins></li>
<li><ins datetime="2015-03-16">Noah</ins></li>
</ul>
Il tag <del> definisce un testo che è stato rimosso. Può contenere al suo interno altri tag come paragrafi o liste. Di default è reso dai browser come testo barrato. <del> supporta gli attributi cite (fornisce la fonte che spiega il motivo della modifica) e datetime (fornisce l’ora della modifica).
<p>I personaggi femminili di <cite>The Walking Dead</cite>:</p>
<ul>
<li><del>Lori</del></li>
<li><del cite="https://youtu.be/lEOoDdQ-ZC8">Andrea</del></li>
<li>Michonne</li>
<li><del>Beth</del></li>
<li>Carol</li>
<li>Maggie</li>
<li><del>Sasha</del></li>
<li><del>Tara</del></li>
<li>Rosita</li>
</ul>Il tag <s> definisce un testo non più accurato o pertinente.
<p><s>La Terra è piatta</s></p>Il tag <small>
Il tag <small> definisce un breve testo di importanza marginale, come ad esempio clausole, attribuzioni di licenza o simili. Alcuni browser lo visualizzano come testo più piccolo.
<p>L'Aspirina cura qualunque malattia!<small>Attenzione, può avere effetti collaterali</small></p><h1>Questo è un titolo molto importante</h1>
<h2>Questo è un titolo meno importante</h2>
<h3>Questo è un titolo ancora meno importante</h3>
<h4>Questo è un titolo poco importante</h4>
<h5>Questo è un titolo davvero poco importante</h5>
<h6>Questo è il titolo meno importante di tutti</h6>
<p>Questo è un paragrafo.</p>
<p>Questo è un altro paragrafo su una nuova riga.</p>
<p>Questo è un paragrafo.</p>
<br> <!-- questo <br> è inutile perchè ogni paragrafo inizia una nuova riga -->
<p>Questo è un altro <br> paragrafo.</p> <!-- Il browser visualizzerà la parola paragrafo su una nuova riga-->
<p>Il mio piatto preferito è il <span lang="es">burrito</span>.</p>
<!-- l'intera frase è marcata come importante mentre la parola "molto" è marcata come doppiamente importante-->
<p><strong>Si prega di proteggersi gli occhi indossando un paio di occhiali <strong>molto</strong> scuri per osservare l'eclissi solare.</strong></p>
<p>Come mai hai lasciato il tuo fidanzato?</p>
<p>No, <em>lui</em> ha lasciato me!</p>
<p>Ecco il discorso di Nathan Young nell'ultima puntata della prima stagione di <cite>Misfits</cite></p>
<!-- il contenuto dell'attributo cite non viene visualizzato dal browser -->
<blockquote cite="https://www.youtube.com/watch?v=NCL2bqqwDQ8">
<p>Lei vi ha fatto credere che dovreste essere così, ma non è vero. Siamo giovani! E' normale per noi bere troppo. E' normale per noi comportarci male e scopare come scimmie!</p>
<p>Il nostro compito è divertirci! Ecco la verità! E sì, alcuni di noi andranno in overdose o impazziranno, ma Charles Darwin ha detto "La frittata non si può fare senza rompere delle uova" ed è di questo che sto parlando. Rompere delle uova! E con questo intendo... farsi come delle zucchine con tutte le droghe possibili.</p>
<p>Dio, se poteste vedervi ora! Mi si spezza il cuore. Indossate dei cardigan! Noi avevamo tutto! Abbiamo mandato a puttane tutto, più e meglio delle generazioni che ci hanno preceduti. Noi eravamo davvero bellissimi!</p>
<p>Siamo dei cazzoni. Io sono un cazzone e voglio essere un cazzone fino alla fine dei miei vent'anni, magari fino all'inizio dei trenta! E sono pronto a farmi mia madre, prima di lasciare che lei o chiunque altro, mi porti via tutto questo!</p>
</blockquote>
<p>Ieri ho sentito la barzelletta più bella del mondo:
<q cite="https://www.youtube.com/watch?v=1Y7EjQsvmBs">Tre pomodori camminano per la strada. Papà pomodoro, mamma pomodoro e il pomodorino. Il pomodorino cammina con aria svagata e papà pomodoro allora si arrabbia e va da lui, lo schiaccia e dice: «Fai il concentrato!».</q>
</p>
<p>Una delle mie citazioni preferite proviene dal telefilm <cite>Lost</cite> e la pronuncia John Locke: <q>Non confondere la coincidenza con il destino.</q></p>
<p>Ecco il mio primo programma in Java!
<pre><code>
public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello, World");
}
}
</code></pre>
</p>
<pre>
,d88b.d88b,
88888888888
`Y8888888Y'
`Y888Y'
`Y' </pre>
<p>I primi personaggi usciti dal cast di <cite>The Walking Dead</cite>:</p>
<ul>
<li>Shane</li>
<li>Dale</li>
<li>Hershel</li>
<li>Merle</li>
<li>Il Governatore</li>
<li><ins>Bob</ins></li>
<li><ins>Tyreese</ins></li>
<li><ins datetime="2015-03-16">Noah</ins></li>
</ul>
<p>I personaggi femminili di <cite>The Walking Dead</cite>:</p>
<ul>
<li><del>Lori</del></li>
<li><del cite="https://youtu.be/lEOoDdQ-ZC8">Andrea</del></li>
<li>Michonne</li>
<li><del>Beth</del></li>
<li>Carol</li>
<li>Maggie</li>
<li><del>Sasha</del></li>
<li><del>Tara</del></li>
<li>Rosita</li>
</ul>
<p><s>La Terra è piatta</s></p>
<p>L'Aspirina cura qualunque malattia!<small>Attenzione, può avere effetti collaterali</small></p>
/* no css */
// no js