Nwlapcug.com


Il codice per modificare la dimensione del carattere in HTML usando per cento

Il codice per modificare la dimensione del carattere in HTML usando per cento


Moderni browser Web consentono navigatori Internet modificare le dimensioni di font utilizzando i controlli del browser. Alcuni utenti con problemi di vista, ad esempio, possono utilizzare questi controlli per rendere il testo più grande. Gli altri potrebbero preferire caratteri più piccoli che permettono loro di adattarsi più testo sullo schermo. Le applicazioni Web hanno anche la possibilità di modificare i caratteri HTML in una pagina. Utilizzando JavaScript, è possibile aumentare e diminuire la dimensione del carattere da qualsiasi percentuale che ti piace.

Istruzioni

1

Avviare l'editor di HTML e creare un nuovo documento.

2

Incollare il codice riportato di seguito nella sezione body del documento:

< div id = "div1" >

Si tratta di un testo

< / div >

< id di input = "Button1" type = "button" value = "Riduci dimensione al 50% della dimensione normale" onclick = "ritorno changeSize ('div1', 50)" / >

< id di input = "Button2" type = "button" valore = "Aumenta di dimensioni fino al 150% della dimensione normale" onclick = "return changeSize ('div1', 150)" / >

Questo esempio crea un elemento div contenente testo. Valore di id di questo elemento è "div1." Due pulsanti vengono visualizzati sotto la div. Ogni pulsante chiama la funzione JavaScript "changeSize" e passa il valore di id del div e un numero. Il primo pulsante passa 50 alla funzione. Che dice la funzione per modificare la dimensione del testo sul 50% della sua dimensione normale. Il secondo pulsante passa 150. La funzione, quando si riceve tale valore, aumenta la dimensione del testo di div fino al 150% del suo valore normale.

3

Aggiungere questo codice alla sezione head del documento:

Function changeSize (elementToChange, newSize) {

elemento var = document.getElementById(elementToChange);

dimensione del var = newSize + "%";

element.style.fontSize = dimensione;

}

Questa è la funzione di "changeSize". Recupera un riferimento all'elemento div e lo memorizza nella variabile denominata "elemento. La riga finale del codice cambia il valore dell'elemento "FontSize" al valore passato alla funzione.

4

Salvare il documento e visualizzarlo nel browser. Il testo viene visualizzato sopra i due pulsanti.

5

Fare clic sul pulsante "Riduci dimensione al 50 per cento del normale dimensione". Il codice JavaScript viene eseguito e diminuisce la dimensione del testo al 50 per cento.

6

Fare clic sul pulsante "Aumenta dimensione al 150 per cento della normale dimensione". Il codice aumenta la dimensione del testo fino al 150% del suo valore normale.

Consigli & Avvertenze

  • Non devi utilizzare pulsanti per modificare la dimensione del testo. L'applicazione può modificare la dimensione del testo in qualsiasi momento chiamando la funzione changeSize e passando l'id dell'elemento che si desidera modificare e il valore di percentuale desiderata. Si supponga, ad esempio, che la pagina Web ha un elemento il cui id è "test". Per aumentare le dimensioni del testo di 300 per cento, eseguire l'istruzione seguente: changeSize ("test", "300").