El tag <textarea> puede resultar de utilidad para:
- Publicar un código en una entrada de forma que evita que los navegadores lo manipulen y modifiquen.
- Colocar un texto largo en un recuadro de forma que controlas el espacio que ocupa dentro de una entrada o post.
- Publicar un código en una entrada de forma que evita que los navegadores lo manipulen y modifiquen.
- Colocar un texto largo en un recuadro de forma que controlas el espacio que ocupa dentro de una entrada o post.
A. Textarea simple:
1. Colocando un código o texto que desees mostrar entre <textarea> y </textarea> :
<textarea>
Texto o código
</textarea>
2. Si se añade a la orden <textarea>, las propiedades "rows" (alto) y "cols" (ancho) controlarán las dimensiones de la misma. Sólo habría que variar las cifras de ambos parámetros o tags.
Ejemplo:
<textarea rows="5" cols="18">
AQUI VA EL CODIGO O TEXTO
QUE DESEAS MOSTRAR
DENTRO DE TU CAJA DE TEXTO
O TEXTAREA.
</textarea>
B. Textarea, o Caja de texto, con selección automática del contenido.
Podemos realizar una textarea donde añadir un código o texto con una peculiaridad:
Al colocar el cursor encima, o hacer clik sobre ella, se seleccionará todo su contenido. Es una fórmula que ahorra al usuario arrastrar el cursor por toda la zona para copiar el contenido.
Al colocar el cursor encima, o hacer clik sobre ella, se seleccionará todo su contenido. Es una fórmula que ahorra al usuario arrastrar el cursor por toda la zona para copiar el contenido.
<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()"></textarea>
Ejemplo:
** Importante: el texto o código a introducir se coloca antes de </textarea>
** Recordar: con las propiedades "rows" (alto) y "cols" (ancho) se pueden controlar las dimensiones de la misma. Sólo habría que variar las cifras.
C. Caja de texto, (Textarea), con botón de selección automática del contenido.
A través de un botón puedes seleccionar todo el contenido que esté situado dentro de la textarea.
<center><form name="select_all">
<textarea rows="10" cols="30" name="text_area">
AQUI VA EL TEXTO O CODIGO A MOSTRAR
</textarea>
<input value="Seleccionar texto" onclick="javascript:this.form.text_area.focus();this.form.text_area.select();" type="button"/></form></center>
Sustituye AQUI VA EL TEXTO O CODIGO A MOSTRAR por el texto o código que vayas a colocar en la cajita:
D. Textarea transparente, sin bordes, para incrustar en el post o entrada.
En esta tipología podemos introducir todo un párrafo, código, imagen, post, o lo que se nos antoje. No es de mis preferidas al parecerme incómoda.
(Paso a anotarla siguiendo las instrucciones de Jaime y su Balcón para que quede a modo de apunte personal.)
■ Código que puedes colocar en una entrada:
<span id="fullpost"><div align="center"><pre style="overflow: auto; width: 410px; height: 160px;"><div align="left"><span >
AQUI EL TEXTO O POST
</span></div></pre></div>
- También se pueden colocar imágenes y texto, de forma que todo quede dentro de la textarea. El código resultante sería:
<span id="fullpost"><div align="center"><pre style="overflow: auto; width: 410px; height: 160px;"><div align="left"><span >
<img src="URL DE LA IMAGEN"/>AQUI EL TEXTO O POST
</span></div></pre></div>
- Ejemplo con texto:
Puedes colocar en este espacio de la textarea todo lo que necesites. No importa su extensión. Recomiendo colocar un aviso por si hubiera algún despistado.
- Ejemplo con imagen y texto:
Puedes colocar en este espacio de la textarea todo lo que necesites. No importa su extensión. Recomiendo colocar un aviso por si hubiera algún despistado.
*Para modificar algunos detalles:
- Situar la caja o textarea en center significa centrado. Para colocarla a la izquierda, escribe left y a la derecha, escribe right.
- width: 410px; Es el ancho de la caja que puede personalizarse variando el número para modificar el tamaño de textarea.
- height: 160px; Es el alto de la caja que puede personalizarse variando el número para modificar el tamaño de textarea.
- width: 410px; Es el ancho de la caja que puede personalizarse variando el número para modificar el tamaño de textarea.
- height: 160px; Es el alto de la caja que puede personalizarse variando el número para modificar el tamaño de textarea.
Un apunte más
Publicar un comentario
(-^o^-) (＾＿－) (#^_^#) (ÖoÖ) (*^o^*) (>_<) （￣へ￣）（；_・） (ô_Ó) (O_O) (ˇ~ˇ) （ToT）(Q____Q) ಠ_ಠ (｡◕‿◕) ［(－－)］ZZzzz
- Si el comentario es anónimo hay muchas posibilidades que no se publique.