W zbiorze HTML

<textarea rows="10"></textarea>

W Zestawie CSS

textarea { height: auto; }

Spowoduje to, że przeglądarka ustawi Wysokość pola tekstowego dokładnie tak, jak liczba wierszy i paddingów wokół niego. Ustawienie wysokości CSS na dokładną ilość pikseli pozostawia dowolne spacje.

Zgodnie z w3c, cols i rows są wymaganymi atrybutami dla textareas. Rows and Cols to liczba znaków, które będą pasowały do obszaru tekstowego, a nie pikseli lub innej potencjalnie arbitralnej wartości. Idź z rows / cols.

Odpowiedź brzmi "tak". Oznacza to, że powinieneś użyć obu. Bez wierszy i cols (i istnieją wartości domyślne, nawet jeśli nie używasz ich jawnie) pole tekstowe jest niezwykle małe, jeśli CSS jest wyłączony lub przesłonięty przez arkusz stylów użytkownika. Zawsze miej na uwadze kwestie dostępności. Mając to na uwadze, jeśli Twój arkusz stylów może kontrolować wygląd textarea, na ogół skończysz z czymś, co wygląda o wiele lepiej, dobrze pasuje do ogólnego projektu strony, i to może zmienić rozmiar, aby nadążyć za wkładem użytkownika (w granicach dobrego smaku, oczywiście).

Rozmiar obszaru tekstowego może być określony przez atrybuty cols i rows, lub nawet lepiej; poprzez właściwości height I width CSS. Atrybut cols jest obsługiwany we wszystkich głównych przeglądarkach. Jedną z głównych różnic jest to, że <TEXTAREA ...> jest znacznikiem kontenera: posiada znacznik start ().

 <textarea style="width:300px; height:150px;" ></textarea>

Zwykle nie określam height, ale określam width: ... i rows i cols.

Zazwyczaj, w moich przypadkach, tylko width i rows są potrzebne, aby textarea wyglądała ładnie w stosunku do innych elem. (I cols jest alternatywą, jeśli ktoś nie używa CSS, jak wyjaśniono w innych odpowiedziach.)

((określanie zarówno rows jak i height wydaje mi się trochę jak powielanie danych?))

Główną cechą textareas jest to, że są one rozszerzalne. Na stronie internetowej może to spowodować, że paski przewijania pojawią się w obszarze tekstowym, jeśli długość tekstu wypełni ustawioną przestrzeń (czy to w wierszach, czy w CSS. Może to być problem, gdy użytkownik zdecyduje się na drukowanie, szczególnie z "drukowanie" do PDF - więc ustaw wygodnie dużą min-Wysokość dla drukowanych tekstów z warunkową regułą CSS:

@media print { 
textarea {
min-height: 900px;  
}
}

Jeśli nie używasz za każdym razem użyj line-height:'..'; właściwość its kontroluje wysokość textarea i właściwość width dla szerokości textarea.

Lub możesz użyć rozmiaru czcionki za pomocą następującego css:

#sbr {
  font-size: 16px;
  line-height:1.4;
  width:100%;
}

CSS

input
{
    width: 300px;
    height: 40px;
} 

HTML

<textarea rows="4" cols="50">HELLO</textarea>