Textarea: Código HTML sencillo para crear cuadro de código HTML. (1)

En una de mis entradas anteriores (ver aquí) les mostré como crear un sencillo botón de enlace para realizar los llamados "intercambios de enlaces" entre otros sitios web o para que ustedes le saquen algún provecho. Muchos de ustedes se habrán dado cuenta de que lo coloqué en un cuadro de código HTML tal y como se los puedo mostrar en la siguiente imagen:

Este cuadro fue utilizado en la entrada anterior para mostrar un código HTML. 

¡Hey! Seguro también te interesa:

• Insertar flash en Blogger
• Colocar dos columnas de texto en la entrada del blog
• Widget de entradas relacionadas

Algunos de ustedes se prguntarán como hice para colocar ese pequeño cuadro. Ese pequeño cuadro blanco lo podemos utilizar a partir del uso de las etiquetas denominadas textarea, los cuáles son unas sencillas etiquetas entre las cuáles irá el texto dentro de ellas, de la siguiente forma:

<textarea>Texto que irá dentro del cuadro de texto </textarea>

En este caso el uso de las etiquetas textarea son útiles al momento de:

• Publicar un código en nuestra entrada evitando así que los navegadores lo interpreten, manipulen y modifiquen.

• Colocar un texto largo en un recuadro de para así controlar el espacio que ocupa dentro de una entrada o post.

para utilizarlo basta con colocar el texto entre las etiquetas tal y como muestra el ejemplo de la imagen de arriba. para crearnos un cuadro como el siguiente:

entretenido ¿no?

Este pequeño cuadro aparecerá de acuerdo aun tamaño preestablecido sin importar el tamaña del texto en su interior y nosotros podremos manipularlo para ajustarlo a un tamaño que deseemos mientras no recarguemos la página ya que volvería a su estado original.

Si lo que queremos es darle un tamaño establecido para no tener que maniular el cuadro cada que recarguemos la página y/o para mostrar su contenido en su totalidad, debemos añadirle unos cuantos valores más para otorgarle un ancho y alto determinado de la siguiente forma:

<Textarea style="height: VALORpx !important; width: VALORpx !important;"> Texto a escribir aquí </textarea>

Así, el cuadro de textarea adoptará los valores que le dimos mediante la etiqueta style. Hay que recordar que height: indicaremos el alto y con width el ancho del cuadro, tal y como se muestra en el siguiente ejemplo:

De tal forma que al escribirlo en nuestra entrada o post nos quede de la siguiente forma:

ESTE TEXTO SE ENCUENTRA EN UN CUADRO DE HTML CON PROPIEDADES DETERMINADAS A SU ANCHO Y ALTO.

¿Lo ven? y resulta increible lo mucho que podemos lograr con este sencillo código, así como lo manipulable que es ya que a este código HTML se le pueden hacer muchas más modificaciones, no obstante estas manipulaciones serán tema para otra entrada.

-----

¿Te fue de ayuda este artículo?

Si el artículo te agrada puedes suscribirte a La Taberna para recibir las últimas actualizaciones del blog o bien, puedes dar me gusta en Facebook, seguir en Twitter o agregar a tus círculos de Google +. También puedes expresar alguna duda, sugerencia, o comentario a través de la página de contacto o aquí en la misma entrada.

¡No te pierdas ninguna publicación!

Suscríbete a La Taberna de Julio y recibirás todas las actualizaciones directamente en tu correo. Cero SPAM, lo prometo :)