Размер текстовой области с помощью CSS с помощью столбцов и строк

В чем разница между размером текстового поля с cols и строками и размером текстового поля с высотой и шириной?

<textarea id="TextArea1" cols="73" rows="12">with cols rows</textarea>
<textarea id="TextArea2" style="height:200px; width:600px";>with CSS</textarea>

jsFiddle

Ответы

Ответ 1

cols и rows относятся к размеру шрифта. height и width не являются.

http://jsfiddle.net/rVUEE/1/

EDIT: Говорить, что они относительно "размера шрифта", слишком упрощены. Они учитывают такие вещи, как line-height и letter-spacing, если они явно заданы.

Ответ 2

  • Атрибуты cols и rows требовались по спецификациям HTML. W3C HTML5 (одобренный в 2014 году) сделал их необязательными, но с непрактичными значениями по умолчанию (20 и 2).
  • Атрибуты вступают в силу, даже когда CSS отключен.
  • С другой стороны, атрибуты "теряют", если размеры также указаны в CSS.
  • Атрибут rows указывает высоту в терминах строк (эффективно, с высотой строки как подразумеваемой единицей), а атрибут cols определяет ширину в терминах "средней" ширины символов, очень неопределенной концепции, интерпретируются по-разному браузерами. В CSS любые CSS-единицы могут использоваться и должны быть явно указаны.

Ответ 3

CSS не так уж и отличается. Результат будет (почти) одинаковым.

Я использую большую часть времени max-width, min-width и то же самое для высоты. В новых браузерах, таких как Chrome, вы можете изменить размер текстового поля.