Ogni volta che sviluppare una nuova forma che include un textarea Ho il seguente dilemma quando ho bisogno di specificare le sue dimensioni:Devo ridimensionare un'area di testo con larghezza CSS/altezza o attributi HTML cols/righe?
Usa CSS o uso al textarea 's attributi cols e rows?
Quali sono i pro e i contro di ciascun metodo?
Quali sono le semantiche dell'utilizzo di questi attributi?
Come si fa di solito?
Si consiglia di utilizzare entrambi. Le righe e le colonne sono necessarie e utili se il client non supporta i CSS. Ma come designer li sovrascrivo per ottenere esattamente la dimensione che desidero.
Il modo consigliato per farlo è tramite un foglio di stile esterno, ad es.
textarea {
width: 300px;
height: 150px;
}<textarea> </textarea>In base al w3c, le colonne e le righe sono entrambi attributi obbligatori per le aree di testo. Rows e Cols sono il numero di caratteri che si adatteranno nella textarea piuttosto che pixel o qualche altro valore potenzialmente arbitrario. Vai con le righe/colonne.
w3c schools afferma che è possibile impostarlo tramite l'attributo rows e cols ma che l'altezza e la larghezza di impostazione sono migliori. Non si fa menzione di righe e colonne che sono un attributo obbligatorio per textarea su w3c.org. http://www.w3schools.com/tags/tag_textarea.asp http://www.w3.org/wiki/HTML/Elements/textarea –
@MichaelStramel la mia risposta è di quattro anni :) - a proposito è * non * scuole w3c. Non sono affiliati. Non sono sicuro che HTML5 abbia un concetto di attributi * required *, ma potrei sbagliarmi. Non vedo ancora perché impostare larghezza/altezza sarebbe meglio di rows/cols anche se –
mi sono reso conto che dopo aver commentato, sentivo comunque che era rilevante per chiunque leggesse questo post. Inoltre, con design reattivi, le righe e le colonne possono causare problemi a meno che non siano impostati tramite JavaScript. L'IMO lo rende in grado di impostarlo attraverso i CSS in un modo molto migliore. –
La risposta è "sì". Cioè, dovresti usare entrambi. Senza righe e colonne (e ci sono valori di default anche se non li usi esplicitamente) la textarea è insolitamente piccola se il CSS è disabilitato o sovrascritto da un foglio di stile dell'utente. Tieni sempre a mente i problemi di accessibilità. Detto questo, se il tuo foglio di stile è autorizzato a controllare l'aspetto della textarea, generalmente finirai con qualcosa che sembra molto meglio, si adatta bene al design complessivo della pagina, e che può essere ridimensionato per stare al passo con l'utente input (entro i limiti del buon gusto, ovviamente).
<textarea style="width:300px; height:150px;" ></textarea>
mai stili harcode, è una cosa degli anni '90 –
@ user470962 Ad hominem. Se si corregge l'errore di sintassi in " – ASHU
Una caratteristica importante delle aree di testo è che sono espandibili. Su una pagina web questo può comportare la visualizzazione di barre di scorrimento nell'area di testo se la lunghezza del testo supera lo spazio impostato (sia che si utilizzino le righe, sia che si usi CSS. Questo può essere un problema quando un utente decide di stampare, in particolare con 'stampa' in formato PDF - in modo da impostare un confortevole grande min-height per textarea stampate con una regola CSS condizionale:
@media print {
textarea {
min-height: 900px;
}
}
se non utilizzare ogni volta l'uso line-height: '..'; immobile il suo controllo la . altezza del textarea e proprietà di larghezza per la larghezza del textarea
o si può fare uso di font-size seguendo css:
#sbr {
font-size: 16px;
line-height:1.4;
width:100%;
}
Va bene, ma devi capire che qualsiasi spazio arbitrario con cui stai impostando le dimensioni andrà sprecato ed è solo per lo spettacolo. –
@tandu: cosa intendi con "sta per sprecare ed è davvero solo per spettacolo"? – BoltClock
righe/colonne si basa sulla dimensione del carattere dell'utente. Quindi, se si ha una larghezza/altezza definita dal css che non può essere divisa dai pixel di un personaggio nella textarea, ci sarà molto spazio bianco lasciato verticalmente e orizzontalmente. Probabilmente nessuno se ne accorgerà, ma dirà semplicemente. –