HTML es el componente básico de la web. Conocer algunas partes menos conocidas pero útiles de este lenguaje de marcado puede hacer su vida mucho más fácil. Los atributos HTML proporcionan varias características que pueden ayudarlo a aprovechar al máximo HTML. Define características o propiedades adicionales de un elemento HTML.

En este artículo, aprenderá acerca de 11 atributos HTML de los que probablemente aún no haya oído hablar.

1. múltiple

Este atributo permite a los usuarios ingresar múltiples valores. Puede utilizar el atributo múltiple con etiquetas y etiquetas Este atributo booleano es válido solo para tipos de entrada de correo electrónico o archivo.

Usando múltiples atributos con


Uso de atributos múltiples para la entrada de archivos

Al utilizar el atributo múltiple para la entrada de archivos, puede seleccionar varios archivos (manteniendo presionada la tecla Cambio o control teclas).

Uso de varios atributos para la entrada de correo electrónico

instagram viewer

Al utilizar el atributo múltiple para la entrada de correo electrónico, puede ingresar una lista de direcciones de correo electrónico separadas por comas. Todos los espacios en blanco se eliminarán de cada dirección de la lista.

2. contento

Puede hacer que el contenido HTML sea editable en una página web utilizando el atributo contenteditable. Este es un atributo global, es decir, es común a todos los elementos HTML.


Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed hacer eiusmod tempor incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis nostrud ejercicio
ullamco laboris nisi ut aliquip ex ea commodo consequat.

3. corrector ortográfico

El atributo de revisión ortográfica especifica si el elemento puede ser revisado por errores ortográficos o no. Puede corregir la ortografía del texto en el elementos, texto en los elementos editables o texto en los elementos de entrada (excepto contraseñas). 

  
 
 Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
 sed do eiusmod tempor incididunt ut labore et dolore magna 
 aliqua. Ut enim ad minim veniam, quis nostrud exercitation 
 ullamco laboris nisi ut aliquip ex ea commodo consequat.

Relacionado: La hoja de referencia de HTML Essentials: etiquetas, atributos y Más

4. descargar

Puede descargar un recurso utilizando el atributo de descarga. El atributo de descarga le dice al navegador que descargue la URL especificada en lugar de navegar a ella. Puede utilizar el atributo de descarga con la etiqueta y la etiqueta .

Nota : el atributo de descarga solo funciona con URL del mismo origen. Sigue las reglas de la política del mismo origen . 

   Descargar

5. accept

El atributo accept de la etiqueta especifica el tipo de archivos que un usuario puede cargar. Puede especificar una lista separada por comas de uno o más tipos de archivos como su valor.

Aceptando un archivo de audio

Aceptación de un archivo de video 

    código>

Aceptación de un archivo de imagen 

    código>

Aceptación de un archivo de Microsoft Word 

   accept = ". doc, .docx, application / msword, application / vnd.openxmlformats-officedocument.wordprocessingml.document ">

Aceptando archivos PNG o JPEG

Aceptando un archivo PDF

Relacionado: Efectos HTML geniales que cualquiera puede agregar a sus sitios web

6. translate

El atributo translate le dice al navegador que el elemento debe ser traducido o no cuando la página está localizada. Puede tener 2 valores: "sí" o "no". 

  
 
 Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
 sed do eiusmod tempor incididunt ut labore et dolore magna 
 aliqua. Ut enim ad minim veniam, quis nostrud exercitation 
 ullamco laboris nisi ut aliquip ex ea commodo consequat.

Relacionado: Ejemplos de código HTML simple que puede aprender en 10 Minutos

7. poster

El atributo poster se utiliza para mostrar una imagen mientras se descarga el video o hasta que el usuario reproduce el vídeo.

Nota : si no especifica nada, no se muestra nada hasta que se muestra el primer fotograma disponible. Cuando el primer fotograma está disponible, se muestra como el fotograma del póster. 

   src = " http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4"
poster="posterImage.png">

8. inputmode

El atributo inputmode indica al navegador qué teclado mostrar cuando un usuario ha seleccionado cualquier entrada o elemento de área de texto. Este atributo acepta varios valores:

None 

     pre > 
 Numérico 
 
    
 
 Tel 
 
    
 
 Decimal 
 
    
 
 Correo electrónico 
 
    
 
 URL 
 
    
  
    
 
 9. patrón 
 
 El atributo patrón del elemento    le permite especificar una expresión regular para la cual se validará el valor del elemento. Puede usar el atributo de patrón con varios tipos de entrada como texto, fecha, búsqueda, URL, teléfono, correo electrónico y contraseña. 
 
  
 
  
 
  
 
  Relacionados:  Mejores sitios para Ejemplos de codificación HTML de calidad   
 
 10. autocompletar 
 
 El atributo de autocompletar especifica si el navegador debe completar automáticamente la entrada en función de las entradas del usuario o no. Puede utilizar el atributo de autocompletar con varios tipos de entrada como texto, búsqueda, URL, teléfono, correo electrónico, contraseña, selectores de fecha, rango y color. Puede utilizar este atributo con los elementos    o  
 
 elementos. 
 
    
 
 11. autofocus 
 
 El atributo de autofocus es un atributo booleano que indica que un elemento debe enfocarse en la carga de la página. Puede utilizar este atributo con  ,   ,   ,  , o   elementos. 
 
 Usando el atributo de enfoque automático con el elemento de entrada 
 
   < / código> 
 
 Uso del atributo de enfoque automático con el elemento seleccionado 
 
    
 
 Uso del atributo de enfoque automático con el elemento textarea 
 
  
Si desea ver el código fuente completo utilizado en este artículo, consulte el Repositorio de GitHub.


 Haga su vida más fácil con JavaScript One-Liners


El código de una sola línea ayuda a lograr más con menos código. Puede utilizar varias frases sencillas de JavaScript para codificar como un profesional.


Con solo una línea de código, puede mezclar una matriz, encontrar el promedio de una matriz, verificar si una matriz está vacía, generar un color hexadecimal aleatorio, generar un UUID aleatorio, etc.



11 frases sencillas de JavaScript que debe conocer
Logre mucho con solo un poco de código utilizando esta amplia gama de frases sencillas de JavaScript.




Leer siguiente

CuotaPíoCorreo electrónico




Temas relacionados
    

  • Programación
    • 

  • HTML
    • 

  • Lenguajes de programación
    • 

  • Consejos de codificación
    • 




Sobre el Autor





Yuvraj Chandra (78 Artículos publicados)
Yuvraj es estudiante de licenciatura en Ciencias de la Computación en la Universidad de Delhi, India. Le apasiona el desarrollo web Full Stack. Cuando no está escribiendo, está explorando la profundidad de diferentes tecnologías.

Más de Yuvraj Chandra







Suscríbete a nuestro boletín


¡Únase a nuestro boletín de noticias para obtener consejos técnicos, reseñas, libros electrónicos gratuitos y ofertas exclusivas!


Haga clic aquí para suscribirse