Mentre molti codificatori ancora utilizzano attributi "cols" e "righe" per le caselle di testo di dimensione nei form HTML, queste misurazioni sono dotate di due difetti. In primo luogo, browser misurano "cols" e "rows" in relazione alla dimensione del carattere utilizzato nella casella di testo. Il secondo difetto riguarda la separazione di contenuto e stile; è molto più facile riprogettare un sito Web quando tutti gli stili sono impostati in un singolo file di Cascading Style Sheets (CSS). Per questi motivi, è necessario modificare la larghezza di una casella di testo utilizzando la proprietà "width" nel codice CSS.

Istruzioni

1

Andare su "Start" nella barra delle applicazioni di Windows e digitare "Notepad" o il nome di un editor di codice nella casella di ricerca. Premere "Enter" per caricare l'editor.

2

Selezionare "File" sulla barra dei menu in alto e aprire il file HTML per la pagina Web contenente la casella di testo. Se la pagina Web non contiene ancora una casella di testo, aggiungere il codice come segue:

< textarea > Sample Text < / textarea >

Il codice precedente crea una casella di testo con un testo predefinito all'interno, "Sample Text." Questo dovrebbe andare tra una coppia di tag "< form >". Quando si modifica un modulo esistente, avrete già questi tag nel codice.

3

Modificare la larghezza della casella di testo con il codice CSS impostando l'attributo di "stile" per la casella. È necessario impostare il valore della proprietà casella "larghezza" in termini di pixel o una percentuale. Un valore di percentuale rende la dimensione della casella modificare con la dimensione del browser, mentre una dimensione di pixel rimane sempre lo stesso. Ecco il codice:

< textarea style = "width: 200px;" >< / textarea >

Sostituire "px" con "%" per modificare un valore percentuale.

4

Scrivere codice CSS per la larghezza della casella di testo in un foglio di stile esterno come questo:

TextArea () {

Larghezza: 50%;

}

Questo codice può anche andare tra tag "< style >" nella sezione head del file HTML. Per selezionare una casella di testo specifica, dategli un attributo ID e modificare il codice a questo:

MYBOX {

Larghezza: 100px;

}

Consigli & Avvertenze

• Gli stessi metodi per impostare la larghezza della casella di testo si applicano anche a qualsiasi ingresso campi nei moduli HTML.
• A volte una pagina Web contenente un modulo non ha un'estensione HTML. Si può anche cercare un file con estensione. PHP, dato che PHP è un linguaggio comune utilizzato con HTML per gestire forme.
• Salvare i file HTML e CSS prima di modificarli.
• Non rimuovere l'attributo "name" da tag in qualsiasi forma che si modifica a meno che non si sa esattamente come funziona quella forma. Molti script si basano su tale attributo per ottenere i valori dall'input dell'utente.