Ask coding questions

← Back to all posts
can someone help i dont know how to add an image in html
Hoboman5454

can someone help i dont know how to add an image in html

Voters
kundanrajput1
Hoboman5454
Comments
hotnewtop
CrazyVideoGamer

Solution

All you have to do is just add an img tag.
Like this:

. The cool_image part is the path to the image (or the location of the image inside the repl). It can be something like ../cool_image, or ./cool_folder_aka_directory/cool_image, which are relative paths. You don't have to do ./cool_image, as they automatically do this when you put in cool_image (so it is basically ./cool_image. You could also put in external URLs, such as https://images.pexels.com/photos/5004611/pexels-photo-5004611.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940, which is a cute cat picture from pexels.

If the size is too small, you can add width/height attributes to it (e.g.

or

, which will create an image of size 500 pixels (px) by 500 pixels. You can do different units though. Finally, for people with slow internet connections, you can add an alt attribute (you probably should always add these, unless the image doesn't matter to people) like this:

For more information, check out W3Schools HTML Images. Or, MDN Img element for the latest information.

RYANTADIPARTHI

Solution

here's how. You have to use the img tag. Like this.

in the imageurl, you can either get the URL for the image, like source. Or you can upload an image, and put it's name.
That should work

RowanFromBJC

I would read up on basic HTML before getting into bigger projects.
Useful sources:
W3Schools (Good for beginners)
Mozilla Docs (Up-to-date and less mistakes)

CrazyVideoGamer

@RowanFromBJC yup, it's literally the 10th thing on w3schools. this guy kinda needs to do google searches

RhinoRunner

If you have a saved picture, go to your files and drag it into the repl.it files. Then, name it something like example. It will have .png or .jpg depending on the fie type. As everyone else was saying, then you just use <img src="example.jpg" alt="The picture couldn't load">

tussiez

The img tag adds a reference to an image in HTML.
With image.png as your image URL, use the following code:

<img src="image.png">. If you would like to set a height and width, use

<img src="image.png" height="240" width="320">
and set the values to a number in pixels.

AloegelhiPlaysR

You can do the element called 'img' and do something like:

tussiez

@AloegelhiPlaysR Do you mean src=?

Wumi4

Use img.