Come cambiare la dimensione del carattere in HTML
Quindi in questo articolo, vedremo come cambiare le dimensioni del carattere in HTML:
- usando pixel
- Utilizzo della percentuale %
- in base alla dimensione dello schermo
- Utilizzo del valore dell'unità effimera
Come modificare la dimensione del carattere in HTML utilizzando la proprietà delle dimensioni del carattere?
In HTML, la dimensione del carattere può essere modificata dalla proprietà del carattere del CSS. La proprietà delle dimensioni del carattere supporta un elenco di opzioni per modificare le dimensioni del carattere secondo alcuni criteri. Questa sezione descrive l'elenco delle possibili opzioni di proprietà di dimensioni dei caratteri per modificare il dimensione del font in html.
- Usando i pixel (PX)
Possiamo cambiare la dimensione del carattere con l'aiuto della proprietà CSS Font-Size e impostare il suo valore in pixel. Un pixel è un'unità di misurazione per specificare l'altezza, la larghezza, le dimensioni dei caratteri, ecc. Utilizzato dagli sviluppatori Web. 1 pixel rappresenta la parte 1/96 di un pollice su uno schermo. Il seguente esempio pratico mostrerà l'uso di questa proprietà con i valori dei pixel. Per impostazione predefinita, la dimensione del carattere è di 16 pixel.
Codice:
Questa è la dimensione del carattere normale in un documento HTML.
La dimensione del carattere viene cambiata in 30 pixel utilizzando la proprietà CSS di dimensioni del carattere.
In questo codice, scriviamo due paragrafi e cambiamo le dimensioni di un paragrafo a 25px utilizzando la proprietà CSS Font-Size.
Produzione:
L'output mostra che la dimensione del carattere viene modificata correttamente nei pixel.
- Utilizzo della percentuale %
Possiamo anche modificare la dimensione del carattere impostando il valore della proprietà CSS di dimensioni dei caratteri in percentuale rispetto alla dimensione del corpo del documento HTML che significa che quando diamo valore in percentuale andrà. Diamo un'occhiata al seguente esempio per capire meglio.
Codice:
Questa è la dimensione del carattere normale in un documento HTML.
La dimensione del carattere viene modificata in percentuale utilizzando la proprietà CSS di dimensioni del carattere.
In questo codice, creiamo due paragrafi e cambiamo le dimensioni del secondo paragrafo utilizzando la proprietà di dimensioni di font CSS e impostare il suo valore al 150 percento.
Produzione:
Questo output mostra che abbiamo modificato correttamente la dimensione del carattere specificando il valore in percentuale.
- Imposta la dimensione del carattere secondo la dimensione dello schermo
La dimensione del carattere può anche essere cambiata dinamicamente. Ciò significa che la dimensione del nostro carattere cambia in base alla dimensione dello schermo dinamicamente. Per cambiare il carattere in base allo schermo che utilizziamo VW (larghezza di visualizzazione). L'esempio seguente mostra l'uso dei valori VW nella proprietà CSS di dimensioni dei caratteri.
Codice:
Questa è la dimensione del carattere normale in un documento HTML.
La dimensione del carattere viene modificata in percentuale utilizzando la proprietà CSS di dimensioni del carattere.
In questo codice, creiamo due paragrafi e cambiamo la dimensione di un paragrafo utilizzando il valore VW che ridimensionerà il testo in base alla dimensione dello schermo.
Produzione:
L'output mostra che il paragrafo con la dimensione del testo normale rimane statico mentre il paragrafo usa VW Valore per modificare la dimensione del carattere si ridimensiona in base allo schermo.
- Utilizzando il valore dell'unità effimera
Possiamo cambiare la dimensione del carattere utilizzando la proprietà CSS di dimensioni del carattere e impostare il suo valore su EM. Qui si dice che sia uguale alla dimensione del carattere del corpo del documento HTML. Per impostazione predefinita, la normale dimensione del carattere del documento HTML è di 16 pixel, quindi possiamo dire che 1EM = 16 pixel. Il seguente esempio pratico mette in mostra l'uso dell'unità EM.
Codice:
Questa è la normale dimensione del carattere nel documento HTML.
La dimensione del carattere viene modificata in percentuale utilizzando la proprietà CSS di dimensioni del carattere.
In questo codice, abbiamo modificato le dimensioni del paragrafo utilizzando la proprietà CSS Font-Size e impostato il suo valore su 2 EM che è pari a 32 pixel.
Produzione:
Questo output mostra che abbiamo modificato la dimensione del carattere usando il valore EM della proprietà CSS di dimensioni del carattere.
Ecco qui! Ora puoi modificare correttamente la dimensione del carattere in HTML usando uno dei metodi sopra menzionati.
Conclusione
In HTML, possiamo cambiare le dimensioni del carattere utilizzando la proprietà CSS Font-dimensionali e impostare i suoi valori in pixel, percentuale, larghezza di visualizzazione e unità effimera. In questo articolo, abbiamo esaminato tutti i set di valore che possono essere utilizzati con la proprietà CSS Font-Size per modificare le dimensioni del carattere in HTML. I pixel, la percentuale ed EM sono i valori fissi mentre l'opzione di visualizzazione manipola il carattere in base alla dimensione dello schermo.