Categorías: código HTML

input type=”email”

Índice

La etiqueta <input>en HTML tiene como valor "email" en su atributo type, input type=”email” esto simboliza a un campo de uno a más direcciones de correos electrónicos. Bueno Esto hace efecto cuando está presente el atributo multiple, este control puede poner una lista de direcciones email separado por comas.

Mientras este ausente el atributo multiple se puede establecer como una entrada de un sola dirección de email en una caja de texto lo cual permite a los usuarios finales editarla en una sola línea de texto. Pero cuando está presente el atributo múltiple, los navegadores pueden facilitar medios para el usuario final elimine edite o agreguen varias cantidad de direcciones de correo email.

indice del tema

Ejemplos

En este presente ejemplo tenemos un formulario con el control de email con una soda entrada de dirección de correo electrónico, para ello haremos el uso del atributo placeholder de HTML5, este atributo nos va a permitir que el usuario final visualice un texto opaco dentro del campo de control, " escriba su correo electrónico", esta descripción o como otras es de Gran utilidad en los campos de control, cuando el usuario final comienza escribir sobre el control te removerá el texto del atributo placeholder.

<form style="background-color: #3f6a9e;">
    <fieldset>
        <legend> Email</legend>
        <p>correo electronico: <br>
            <input type="email" placeholder=" Escriba su correo electronico">
        </p>
        <input type="submit">
    </fieldset>
</form>

Para determinar valores para el control cuando cargue la página haremos el uso del atributo value, como usted podrá ver en este ejemplo.

<form style="background-color: #3f6a9e;">
    <fieldset>
        <legend> Email</legend>
        <p>correo electronico: <br>
            <input type="email" placeholder=" Escriba su correo electronico" style="width: 40%;" value="irrazabalhilder@gmail.com">
        </p>
        <input type="submit">
    </fieldset>
</form>

En este ejemplo haremos el uso del atributo múltiple, como ya hemos mencionado antes con anterioridad este atributo nos permitirá ingresar varias cantidades de direcciones de correo, la suposición es que los navegadores deberían de facilitar una interfaz así poder facilitar a los usuarios finales cómo eliminar, agregar y editar del dicho control.

<form style="background-color: #3f6a9e;">
    <fieldset>
        <legend> Email</legend>
        <p>correo electronico: <br>
            <input type="email" placeholder=" Escriba su correo electronico" style="width: 45%;" multiple>
        </p>
        <input type="submit">
    </fieldset>
</form>


En este último ejemplo de input type=”email” haremos el uso del atributo required, este atributo no permitirá enviar el contenido del formulario hasta que ingrese un correo electrónico.

<form style="background-color: #3f6a9e;">
    <fieldset>
        <legend> Email</legend>
        <p>correo electronico: <br>
            <input type="email" placeholder=" Escriba su correo electronico" style="width: 45%;" multiple required>
        </p>
        <input type="submit">
    </fieldset>
</form>


admin

Ver comentarios

  • Muy interesante el post, tengo algo de experiencia y no conocía estos detalles, gracias!

Compartir
Publicado por
admin

Entradas recientes

Descargar driver brother hl 4150cdn

En el siguiente artículo les vamos a enseñar a descargar el driver brother hl 4150cdn de…

1 semana hace

Descargar driver brother dcp j125

En el siguiente artículo les vamos a enseñar a descargar el driver brother dcp j125 de…

1 semana hace

Descargar driver brother hl 1210w

En el siguiente artículo les vamos a enseñar a descargar el driver brother hl 1210w de…

1 semana hace

Descargar driver brother mfc j480dw

En el siguiente artículo les vamos a enseñar a descargar el driver brother mfc j480dw de…

1 semana hace

Descargar driver brother dcp j4120dw

En el siguiente artículo les vamos a enseñar a descargar el driver brother dcp j4120dw de…

1 semana hace

Descargar driver brother hl 5340d

En el siguiente artículo les vamos a enseñar a descargar el driver brother hl 5340d de…

1 semana hace