Tecnología

Inicio

Cómo cambiar el tamaño de cuadros de texto

Cómo cambiar el tamaño de cuadros de texto


Los cuadros de texto le ayudan a recopilar datos de un formulario web. Se puede cambiar el tamaño de su cuadro de texto para que se ajuste un área de su página o se alinean con otros cuadros de texto que ha creado. La etiqueta de entrada le permite crear, nombre y cambiar el tamaño de los cuadros de texto en una página web. Se puede manipular la anchura de un cuadro de texto con Hypertext Markup Language (HTML) o su altura y anchura con Cascading Style Sheets (CSS).

Instrucciones

Cambiar el tamaño con CSS

1 Abra un editor de texto, como el Bloc de notas, TextPad o EditPad. Seleccione "Archivo" y "Abrir" en el menú. Haga doble clic en el archivo HTML que contiene el cuadro de texto que desea cambiar el tamaño.

2 Añadir el siguiente estilo entre las etiquetas <HEAD> </ HEAD> para cambiar el tamaño de las dimensiones del cuadro de texto. En el siguiente cuadro de texto tiene una altura de 50 píxeles y 200 píxeles de ancho. Para utilizar un tamaño diferente, cambie el valor de la altura y la anchura.

<Style type = "text / css">
<! -
.myinput {
Anchura: 200px;
altura: 50px;
}
->
</ Style>

3 Desplazarse a la etiqueta <BODY> y encontrar el código HTML para el cuadro de texto. Será similar a:

<Input type = "text" name = tamaño "Nombre" = "20" />

4 Retener '<input type = "text" name = "Nombre" />', sino eliminar "size =" 20 " 'a partir del código. Añadir el nombre de clase ( "myInput") desde el estilo que ha creado, para que se lea de la siguiente manera:

<Input type = "text" name = "Nombre" class = "myInput" />

5 Repita el paso anterior para cambiar el tamaño de los cuadros de texto adicionales. Todos los cuadros de texto que incluyen "class =" myInput " 'se redimensionan automáticamente en la página.

6 Seleccione "Archivo" y "Guardar" para actualizar la página.

Cambiar el tamaño con HTML

7 Comience su editor de texto favorito, como el Bloc de notas, TextPad o EditPad. Seleccione "Archivo" y "Abrir" en el menú. Haga doble clic en el archivo HTML que desea modificar.

8 Desplazarse hasta el código HTML para el cuadro de texto. Será similar a:

<Input type = "text" name = tamaño "mi_nombre" = "20" />

9 Cambie el valor de "tamaño" al tamaño que desea establecer. Por ejemplo, para ajustar la duración de "40", utilice la siguiente:

<Input type = "text" name = tamaño "mi_nombre" = "40" />

10 Seleccione "Archivo" y "Guardar" en el menú para guardar los cambios.