Atributo de descarga html

Mientras desarrollamos cualquier aplicación, a menudo necesitamos hacer que las imágenes sean descargables. Por ejemplo, un sitio web de cartera que proporciona a los usuarios currículums de muestra para descargar o más. Para hacerlo, HTML ofrece el "descargar"Atributo se utilizará dentro de la etiqueta de anclaje.

Este artículo demostrará el atributo de descarga HTML.

Cómo descargar una imagen en HTML?

El "descargar"El atributo se utiliza dentro del""O etiqueta de anclaje. Este atributo convertirá el enlace en un enlace descargable, que descargará la imagen especificada en el "href" atributo.

Ejemplo

En HTML, agregue un nuevo elemento Div con el nombre de la clase "contenido"Dentro de la sección del cuerpo. Luego, especifique un "

"Etiqueta para agregar algún texto. Después de eso, cree otro Div con el nombre de la clase "descarga". Dentro de este DIV, agregue la etiqueta asociada con los atributos href que especifican el enlace a la imagen y el atributo de descarga. Luego, defina la etiqueta con los siguientes atributos:

• "SRC"Para proporcionar un enlace a la imagen.
• "alternativo"Especifica el texto que se muestra si la imagen no puede cargarse.
• "anchoSe utiliza la propiedad para configurar el ancho de la imagen.
• "alturaLa propiedad se utiliza para establecer la altura de la imagen:

Haga clic en la imagen para descargarla:

Pasemos a la sección CSS!

Estilo "Contenido" Div

.contenido
Color de fondo: #b9e0ff;
relleno: 10px;

El contenido Div se aplica con las siguientes propiedades CSS:

• "color de fondoLa propiedad se utiliza para aplicar el color de fondo al elemento.
• "relleno"La propiedad agrega espacio dentro del elemento.

Estilo "Descargar la imagen" Div

.descarga-imagen
Ancho: 300px;
Altura: 200px;
margen: auto;

El ".descarga"Se utiliza para acceder al"descarga"Div. Se aplican propiedades por debajo:

• "ancho"La propiedad establece un ancho de elemento HTML.
• "alturaLa propiedad establece la altura de un elemento HTML.
• "margenLa propiedad se utiliza para agregar espacio alrededor del elemento.

Elemento de estilo "P"

.contenido p
tamaño de fuente: 20px;

El "tamaño de fuente"Propiedad aplicada en el

La etiqueta se utiliza para establecer el tamaño de la fuente.

Se puede observar que cuando hemos hecho clic en la imagen, comienza a descargarse en nuestro sistema:

Consejo de bonificación: descargue la imagen con un nombre de autoexplicación

Podemos asignar un valor al atributo de descarga. Luego, el archivo se descargará con este nombre especificado. Es útil en escenarios si la imagen tiene un nombre que no está asignado de manera significativa en el atributo HREF.

Supongamos que la imagen tiene el nombre "ABC2334.png"Lo cual no es significativo. Entonces, al atributo de descarga se le asigna el valor "pingüino":

Se puede ver en la imagen a continuación que la imagen se descarga con un nombre especificado en el atributo de descarga:

Eso se trataba del método para crear un enlace descargable en HTML.

Conclusión

En HTML, el atributo de descarga se agrega al elemento de anclaje HTML. Esto hará que el enlace sea un enlace descargable. La imagen se puede descargar con el nombre deseado. Para hacerlo, el atributo de descarga se establece con el valor como nombre del archivo. Este artículo ha demostrado el atributo de descarga HTML con un ejemplo práctico.