Home > Article > Web Front-end > How to use animated images in HTML pages?
How to use animated images in HTML pages?
- PHPzforward
- 2023-08-24 08:13:032712browse
Animated images in HTML are images that move on a web page. It is in GIF format, or Graphics Interchange Format file.
We need to add an animated image in HTML using theIn addition, we can also use the height and width attributes to set the height and width of the image.
grammar
<image src=”Animated image”>
Example 1
The following is an example showing how to use animated images in HTML pages -
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="description" content="meta tag in the web document"> <meta name="keywords" content="HTML,CSS"> <meta name="author" content="lokesh"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <p>Adding Animated Images to the web page</p> <img src="https://tutorialspoint.com/images/html.gif" alt="How to use animated images in HTML pages?" > </body> </html>
Example 2
Translated into Chinese:Example 2
You can try running the following command to process animated images in HTML -
<!DOCTYPE html> <html> <head> <title>Animated Image</title> </head> <body> <h1>Animated Image</h1> <img src="https://media.giphy.com/media/3o6UBpHgaXFDNAuttm/giphy.gif" alt="How to use animated images in HTML pages?" > </body> </html>
Example 3
We can change the height and width of animated images using stylesheets.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="description" content="meta tag in the web document"> <meta name="keywords" content="HTML,CSS"> <meta name="author" content="lokesh"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <p> dding Animated Images to the web page</p> <img src="https://tutorialspoint.com/images/html.gif" style="max-width:90%" style="max-width:90%" alt="How to use animated images in HTML pages?" > </body> </html>
The above is the detailed content of How to use animated images in HTML pages?. For more information, please follow other related articles on the PHP Chinese website!
Statement：
This article is reproduced at:tutorialspoint.com. If there is any infringement, please contact admin@php.cn delete