Z-Graphics

El tag <textarea> es muy util para publicar texto o codigo, sin que los nagvegadores lo interpreten o para poner un texto demasiado largo.Para poner un texto dentro de un textarea, debes abrir el tag <textarea> y cuando hallas escrito tu texto, debes cerrarlo </textarea> .

Por ejemplo, supongamos que tengo un texto y quiero ponerlo dentro de una caja de texto. lo que tengo que hacer es abrir el tag, pegar el texto y cerrar.
si lo hacemos correctamente quedaria algo como esto:

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

pues bien, dado que es un texto no tan corto el textarea se ve, esteticamente, mal. Para eso vamos arecurrir a las propiedades "rows" y "cols" , con eso podrás controlar ancho y alto.

por ejemplo, en el textarea anterior simplemente escribimos <textarea> ahora vamos a agregar lo sigueinte:

<textarea rows"10" cols"30">

y el resultado seria este

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Es muy comun que los <textarea> se usen para poner links, y codigos para redes sociales, asi que es muy practico que cuando el texto sea un poco largo se auto seleccione y no halla necesidad de bajar todo el scroll con el mouse. Para esto hay que agregar unas nuevas lineas en el tag:

<textarea rows="2" cols="25" onMouseOver="this.focus()"onFocus="this.select()" input type="text" name="emailaddr" value="your e-mail" size="31" onMouseOver="this.focus()" onFocus="this.select()"> </textarea>

identifiquemos el nuevo contenido:

onMouseOver="this.focus()"onFocus="this.select()" input type="text" name="emailaddr" value="your e-mail" size="31" onMouseOver="this.focus()" onFocus="this.select()"

y este seria el resultado:


<a href="http://z-graphics.blogspot.com">z-graphics</a>

Hasta ahora hemos aprendido lo basico en un textarea (o "caja de texto") pero tambien es importante la apariencia. Esta se la podemos otorgar por medio de codigoo css, por ejemplo: cambiar el color del scroll (barra que se desplaza), el fondo, y muchos mas tags propios del css.

aunque en esta entrada no profundizaremos en codigo css, si voy a proporcionar algunos ejemplos simples de modificar segun tu pagina web y tu gusto:

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Ver codigo css:
EXPANDIRCONTRAER

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Ver codigo css:
EXPANDIRCONTRAER

<form action="http://www.google.com/custom" method="get"><p><input name="q"><input type="submit" value="Buscar"><input type="hidden" value="z-graphics.blogspot.com" name="sitesearch"></p></form><br /><br />

Ver codigo css:

EXPANDIRCONTRAER



NOTA: Para poder enlazar el codigo css con el textarea en nesesario agregar: "class="ejemplo-1" (en este caso) al tag <textarea>

Recomendacion: Para facilitar el trabajo de editar el codigo del scroll visita

http://www.maketemplate.com/scrollbar/

y para editar los colores del fondo visita http://html-color-codes.info/