05. Adding Image to a HTML page

3 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
This is a free item
$0.00
د.إ0.00
Kz0.00
ARS$0.00
A$0.00
৳0.00
Лв0.00
Bs0.00
B$0.00
P0.00
CA$0.00
CHF 0.00
CLP$0.00
CN¥0.00
COP$0.00
₡0.00
Kč0.00
DKK kr0.00
RD$0.00
DA0.00
E£0.00
ብር0.00
€0.00
FJ$0.00
£0.00
Q0.00
GY$0.00
HK$0.00
L0.00
Ft0.00
₪0.00
₹0.00
ISK kr0.00
¥0.00
KSh0.00
₩0.00
DH0.00
L0.00
ден0.00
MOP$0.00
MX$0.00
RM0.00
N$0.00
₦0.00
C$0.00
NOK kr0.00
रु0.00
NZ$0.00
S/0.00
K0.00
₱0.00
₨0.00
zł0.00
₲0.00
L0.00
QR0.00
SAR0.00
SEK kr0.00
S$0.00
฿0.00
₺0.00
$U0.00
R0.00
ZK0.00
Already have an account? Log In

Transcript

In the session, let us learn how to add an image to a web page. for adding an image you need to go in for this img tag. This img tag has got few attributes, SRC, our width and height. They are image which you want to add should be added to src. If the icon is text if the image is not available, which the width of the image high to the height of the image. Let me now show you an example of how to use this image that I have created a HTML file IMG demo, I want to add an image to this particular web page.

For this I need a JPG file. I have added the JPG files to the same folder. Either you can have the file in the same folder Are you can use the path the right approaches to have the image in the face. folder are the sub folder of this main folder. What you can do is you can create images folder inside the html5 folder and add the image and you give the path in src. Now let me show you here the tag is IMG, SRC equals to then add a call to isocyanate text.

Then you have got a height and width, right. Height equal to width equal to and close the image that was your selfie the filename panda one dot jpg, then I alternative text then the height and width which you want. So I'm just putting it as 300 pixels and with the 300 pixels. Save this. Now again later Click Open and browser. Now you can see the output the image is properly rendered in the browser.

Now I will show you what if I'm having the image in a subfolder. I'm going back to sublime. I need to create a new folder inside html5. So let me select HTML file. Okay, I'll go here file open folder. Now I have got HTML file inside which I need to create a new folder images.

Right. Now I have got this images folder. The next thing is I need to add this JPG file inside the images folder. Let me do that Father this JPG file inside the images folder. Let me come back to the file. Here.

I need to specify images slash panda one dot jpg. Now let me say this. Again, right click open in browser. You don't have to do this. You can go back to refreshes, I want to show you how they affect us. That's it.

You can see the output. So you add an image to the face. That's it. Thank you.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.