Ask Question Sign In Sign Up

How to insert gif animation in HTML?

Member

by ernest , in category: HTML/CSS , 2 years ago

How to insert gif animation in HTML?

Facebook Twitter LinkedIn Telegram Whatsapp
gif image html insert gifanimation

2 answers

Member

by leta , 2 years ago

@ernest  You can insert a gif animation into html just like a regular picture via img: 

1
2
3
4
5
6
7
8
9

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
  </head>
  <body>
    <img src="image/1.gif" />
  </body>
</html>

Member

by marianne , a year ago

@ernest 

To insert a GIF animation in HTML, you can follow these steps:

  1. Save the GIF file to your computer.
  2. Open a text editor, such as Notepad or Sublime Text, and create a new HTML file.
  3. In the HTML file, add an <img> tag, with the "src" attribute pointing to the location of the GIF file on your computer. For example:
1

<img src="path/to/gif/file.gif">


  1. Save the HTML file and open it in a web browser. The GIF animation should now be visible on the webpage.


Here is an example of a complete HTML code that displays a GIF animation:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

<!DOCTYPE html>
<html>
<head>
	<title>My GIF Animation</title>
</head>
<body>
	<h1>My GIF Animation</h1>
	<img src="path/to/gif/file.gif">
</body>
</html>


Replace "path/to/gif/file.gif" with the actual file path of your GIF animation on your computer.

Related Threads:

How to insert a horizontal line in HTML?
How to insert an image in HTML?
How to insert svg code into HTML?
How to insert multiple images in HTML?
How to insert a pdf file as an image in html?