Salve a tutti e bentornati in questo mio piccolo angolo di web!
Oggi torna Pillole Di HTML una delle sottocategorie della sezione tutorial di questo blog. In questo secondo episodio, come vi avevo già detto, parleremo nuovamente di paragrafo e in particolare di come inserire il grassetto, il corsivo, il sottolineato e come cambiare colore ad una singola parte del paragrafo in HTML(una sola parola o frase).
Come Creare Un Paragrafo In HTML: Grassetto
L’altra volta avevamo visto come creare un paragrafo, adesso è arrivato il momento di provare ad affinare la parte visiva del testo. Direi quindi di partire con il grassetto. Per mettere in grassetto un paragrafo o una parola si usa il tag <b>. Per aprire il tag si usa <b> per chiuderlo si usa </b>. In mezzo ai due tag si inserisce la parola, la frase o l’intero paragrafo da “grassettizzare”. Qui sotto, come la scorsa volta, vi lascio il codice copiabile.
<p> Ecco un esempio di <b>grassetto</b> per quanto riguarda una sola parola</p>
<p> Ecco un esempio di <b>grassetto per un intera frase</b> per quanto riguarda una sola parola. Come vedete sostanzialmente non cambia nulla, si mettono semplicemente più parole tra i due tag</p>
Per quanto riguarda tutto il paragrafo è la stessa cosa, basta includere tutto il testo del paragrafo tra <b> e </b>.
<p><b>Ecco un esempio di grassetto per un intero paragrafo</b></p>
Corsivo
Il corsivo segue le stesse regole del grassetto solo che il tag utilizzato è <i> con <i> come tag di apertura e </i> come tag di chiusura. Nel mezzo dei due tag va messa la frase, la parola o il paragrafo interessato. Vi lascio qui sotto i codici copiabili.
<p> Ecco un esempio di <i>corsivo</i> per quanto riguarda una sola parola</p>
<p> Ecco un esempio di <i>corsivo per un intera frase</i> per quanto riguarda una sola parola. Come vedete sostanzialmente non cambia nulla, si mettono semplicemente più parole tra i due tag</p>
<p><b>Ecco un esempio di grassetto per un intero paragrafo</b></p>
Sottolineato
Passiamo ora alla peultima tappa, il sottolienato: ebbene, è sempre la stessa cosa, cambia solo il tag che questa volta è <u>. Come sempre per aprire si usa <u> e per chiudere si usa </u>. Tutto ciò che verrà messo in mezzo ai due tag verrà visualizzato come sottolineato. Come sempre i codici copiabili vi aspettano qui sotto.
<p> Ecco un esempio di <u>sottolineato</u> per quanto riguarda una sola parola</p>
<p> Ecco un esempio di <u>corsivo per un intera frase</u> per quanto riguarda una sola parola. Come vedete sostanzialmente non cambia nulla, si mettono semplicemente più parole tra i due tag</p>
<p><u>Ecco un esempio di grassetto per un intero paragrafo</u></p>
E Se Volessi Mettere Più Tag Insieme (Per Esempio Così)?
Può capitare di voler sottolineare e nello stesso tempo “grassettare” una parte di testo. Come farlo in HTML? Nulla di più semplice vi basterà mettere vicini i tag di apertura e chiusura che desiderate utilizzare nel modo che vedete qui sotto (il codice è sempre copiabile). Provare per credere!
<p> Ecco un esempio di <i><b><u>corsivo per un intera frase</i></b></u> per quanto riguarda una sola parola. Come vedete sostanzialmente non cambia nulla, si mettono semplicemente più parole tra i due tag</p>Come Creare Un Paragrafo In HTML: Come Cambiare Colore Ad Una Sola Parte Del Paragrafo
Ed eccoci arrivati all’ultima parte della “lezione” di oggi: come cambiare colore ad una sola parte del paragrafo. La scorsa volta avevamo visto come cambiare il colore a tutto il paragrafo, questa volta vedremo come cambiare il colore ad una sola parte del paragrafo. Non ci crederete ma è una cosa molto utile soprattutto per chi utilizza WordPress con l’editor a blocchi.
Per cambiare colore ad una sola parte del paragrafo dobbiamo utilizzare il tag <font> (sempre con chiusura </font>) e l’atributo style con questa “grammatica”. <font style=”color:red;”> parte da colorare </font>. In realtà ci sono tre modi per far capire al nostro amico web che colore vogliamo. Il primo è quello che avete visto, ovvero inserire il nome del colore.
Il secondo, invece è il codice esadecimale che è composto da un # seguito da una serie di lettere e numeri. Per esempio gli elementi in rosa sul mio blog hanno come codice esadecimale #efa7a1. Si mette sempre nello stesso posto quindi il risultato è <font style=”color:#efa7a1:”>parte da colorare </font>.
Il terzo metodo, che è anche quello meno utilizzato, è quello dell’RGB (spesso confuso con il codice esadecimale) che è rgb(239,167,161,100). Il risultato quindi è: <font style=”color:rgb(239,167,161,100);”> parte da colorare </font>. Personalmente vi consiglio di utilizzare il codice esadecimale più semplice e preciso. Qui sotto però vi lascio tutti gli esempi, sempre con codici copiabili.
<p>Questo è un'esempio di <font style="color:red;">frase colorata </font> con nome del colore</p>
<p>Questo è un'esempio di <font style="color:#efa7a1;">frase colorata </font> con codice esadecimale</p>
<p>Questo è un'esempio di <font style="color:rgb(239,167,161);">frase colorata </font> con RGB</p>
Esempio Riassuntivo (Ovviamente Copiabile)
<p> La <b>Befana</b> vien di notte, con le scarpe tutte <i>rotte</i>, <font style="color:#efa7a1;">se ne compra</font> un altro <u>paio</u> con la <u><i>penna e il calamaio</u></i>.</p>
Bene, e con questo concludiamo la “lezione” di oggi dedicata a come creare un paragrafo in HTML. Spero che vi sia stata utile e soprattutto spero di aver spiegato tutto nel modo più semplice possibile. Naturalmente se avete dei dubbi non esitate a chiedere nei commenti e se vi va fatemi sapere se proverete questi codici (e nel caso, com’è andata). Detto questo come sempre vi ringrazio per il tempo che avete dedicato alle mie parole.
Al prossimo post!
Se il post ti è piaciuto lascia un commento (ci tengo, lo ammetto) e condividilo! Sono piccoli gesti che possono può aiutarmi molto!
