Cada vez que desarrollar un nuevo formulario que incluye un textarea tengo el siguiente dilema cuando necesito especificar sus dimensiones:¿Debo dimensionar un área de texto con ancho/alto CSS o atributos cols HTML/filas?
Uso CSS o uso el textarea 's atributos cols y rows?
¿Cuáles son los pros y los contras de cada método?
¿Cuál es la semántica del uso de estos atributos?
¿Cómo se suele hacer?
Recomiendo usar ambos. Las filas y columnas son necesarias y útiles si el cliente no es compatible con CSS. Pero como diseñador, los sobrescribo para obtener exactamente el tamaño que deseo.
La forma recomendada de hacerlo es a través de una hoja de estilo externa, p.
textarea {
width: 300px;
height: 150px;
}<textarea> </textarea>Según el w3c, cols y rows son ambos atributos necesarios para textareas. Las filas y las columnas son la cantidad de caracteres que van a caber en el área de texto en lugar de píxeles o algún otro valor potencialmente arbitrario. Ir con las filas/cols.
w3c schools establece que puede establecerlo a través del atributo rows y cols, pero que la configuración de alto y ancho es mejor. No se menciona que rows y cols sean un atributo obligatorio para textarea en w3c.org. http://www.w3schools.com/tags/tag_textarea.asp http://www.w3.org/wiki/HTML/Elements/textarea –
@MichaelStramel mi respuesta es cuatro años :) - por cierto es * no * escuelas w3c. Ellos no están afiliados. No estoy seguro de que HTML5 ya tenga un concepto de atributos * obligatorios *, pero podría estar equivocado al respecto. Todavía no veo por qué configurar el ancho/alto sería mejor que las filas/columnas, aunque –
Me di cuenta de que después de que comencé, pero todavía sentía que era relevante para cualquiera que lea esta publicación. Además, con diseños receptivos, las filas y cols pueden causar problemas a menos que estén establecidos a través de JavaScript. Ese IMO hace que configurarlo a través de CSS sea mucho mejor. –
La respuesta es "sí". Es decir, deberías usar ambos. Sin filas y columnas (y hay valores predeterminados, incluso si no los usa explícitamente), el área de texto es increíblemente pequeño si CSS está deshabilitado o anulado por una hoja de estilo del usuario. Siempre tenga preocupaciones de accesibilidad en mente. Dicho esto, si su hoja de estilo tiene permiso para controlar la apariencia del área de texto, generalmente terminará con algo que se ve mucho mejor, se ajusta bien al diseño general de la página, y, que puede redimensionarse para mantenerse al día con el usuario entrada (dentro de los límites del buen gusto, por supuesto).
<textarea style="width:300px; height:150px;" ></textarea>
nunca estilos de código de barras, eso es una cosa de los años 90 –
@ user470962 Ad hominem. Si corrige el error de sintaxis a ' – ASHU
Una característica principal de textareas es que son ampliables. En una página web, esto puede hacer que aparezcan barras de desplazamiento en el área de texto si la longitud del texto sobrepasa el espacio que estableció (ya sea utilizando filas o usando CSS. Esto puede ser un problema cuando un usuario decide imprimir, especialmente con 'impresión' a PDF - por lo que establece una cómoda y amplia min-altura para áreas de texto impresos con una regla CSS condicional:
@media print {
textarea {
min-height: 900px;
}
}
si usted no utiliza cada uso del tiempo line-height: '..'; la propiedad de su control de la . altura del área de texto y la propiedad de ancho para ancho de área de texto
o se puede hacer uso de la fuente de tamaño siguiendo css:
#sbr {
font-size: 16px;
line-height:1.4;
width:100%;
}
Esto está bien, pero debes darte cuenta de que cualquier espacio arbitrario con el que estés configurando el tamaño se desperdiciará y es realmente solo para mostrar. –
@tandu: ¿Qué quiere decir con "va a perder y es realmente solo para mostrar"? – BoltClock
filas/columnas se basa en el tamaño del carácter del usuario. Por lo tanto, si tiene un ancho/alto definido por css que no se puede dividir por los píxeles de un carácter en el área de texto, va a haber mucha hoja blanca que quede vertical y horizontalmente. Probablemente nadie lo note, solo diga. –