Caja de Texto y Codigos

El tag <textarea> o caja de código puede ser útil de verdad, ya que evita que que los navegadores manipulen o modifiquen un código.
También le ayuda a controlar un texto largo, impidiendo abarque gran parte de la entrada o para que lo enlazen a otra pagina.

Primero presento una caja de texto simple:

<textarea> Texto o código </textarea>

Texto o código

Ahora se le añaden las propiedades "rows" (alto) y "cols" (ancho) quienes controlaran el tamaño de la caja. Sólo habrá que variar las cifras de ambos parámetros o tags.

<textarea rows="5" cols="18"> Texto o código a mostrar dentro de la caja </textarea>

Texto o código a mostrar dentro de la caja

También se puede realizar una caja de código que al ser señalada por el puntero, se seleccione el texto estomáticamente y así ahorra arrastrar el cursor por toda la zona como se muestra a continuación:

<textarea rows="2" cols="5" onMouseOver="this.focus()" onFocus="this.select()" input type="text" name="emailaddr" value="your e-mail" size="31" onMouseOver="this.focus()" onFocus="this.select()"> Si colocas el cursor encima del recuadro, se seleccionara el contenido ya sea codigo o texto. </textarea>

Si colocas el cursor encima del recuadro, se seleccionara el contenido ya sea codigo o texto.

Otra forma diferente de seleccionar el contenido.
Es por medio de un boton como en el siguiente ejemplo:

<form name="select_all"> <textarea rows="5" cols="18" name="text_area"> Texto o codigo a seleccionar </textarea> <input value="Seleccionar texto" onclick="javascript:this.form.text_area.focus();this.form.text_area.select();" type="button"/></form>

Texto o codigo a seleccionar

Ahora como poner una imagen o color de fondo dentro de la caja.

<form><textarea rows="5" cols="18" style="background-image: url(Url de imagen); color: rgb(255, 255, 255); font-weight: bold; font-size: 10pt;"> Texto o codigo con imagen de fondo </textarea> </form>

Texto o codigo con imagen de fondo

Aqui solo se cambia el color "#009900" (codigo hexadecimal).

<form><textarea rows="5" cols="18" style="background: #009900; color: rgb(255, 255, 255); font-weight: bold; font-size: 10pt;"> Texto o codigo con color de fondo </textarea> </form>

Texto o codigo con color de fondo

Tambien otro codigo util relacionado con las cajas, es el boton de enlaze directo de un widget hacia otra pagina.

Ejemplo:

<img src="Url de imagen"/><form action="http://beta.blogger.com/add-widget" target="_blank" method="post"> <input value="" name="widget.title" type="hidden"/> <textarea style="display: none;" name="widget.content"> <a href="Direccion del blog"><img src="Url de imagen"/></a> </textarea> <input value="Enlazar" name="go" type="submit"/> </form>

<br /><a href="Direccion del blog"><img src="Url de imagen"/></a><br />