How to Insert Image in HTML using Notepad Step By Step

how to insert image in html using notepad step by step.
This this Video Tutorial we will Understand how to insert image in html using notepad step by step.
For that Watch the Video and Follow Few Easy Steps.
Topic:
HTML Syntax
HTML Images Tag
IMG tag's SRC Attribute
Height Attribute
Width Attribute
CSS
JavaScript
Hope You will find this Video Helpful.
Tags:
how to insert image in html,how to insert image in html web page using notepad,html (programming language),How to Insert Image in HTML using Notepad Step By Step,how to insert image,how to insert,how to insert image in website,how to insert image in web page,html website,image in html,html image,image in website,image (literature subject),how-to (website category),how to insert image in html using notepad,steps to insert a picture in notepad,img src

[@Himnish2101]

is there any way to put the picture to the right side? btw very good and helpful video!

[@shudocode]

To put an image on the RIGHT side,
you can use
float: right;
CSS property.
You can also use Flexbox
(Add
display: flex;
justify-content: flex-end;
to the parent element

[@Tracks777]

nice video

[@shudocode]

thanks for watching

[@born2succeed61]

very very very
useful video
Thank you sir
#thanku

[@shudocode]

Thank you very very very much for watching

[@crazyoverkittenslove560]

thank you very very much. i didn't know how to change the height and the width of the image but now i understand. thank you for the intense help

[@shudocode]

Glad I could help!
BTW thanks for Watching

[@lynelledelacruz7831]

thank you very much for this video
this was very helpful

[@shudocode]

Thank you for Watching

[@minakhidas7407]

Thank you it works

[@shudocode]

Thanks for wathing

[@hitarth9783]

Hello plz reply
After I changed the image location (from one folder to another) I was not able to open the image in html so why is it ? Maine image location badli toh uske baad woh open nai ho rahi thi ,aisa kyu?

[@shudocode]

Because your Browser get the Image from your Given Image Path (src="myimg.jpg")
And if you move your image to another Folder or new location
Your Brower don't know where your image file actually is
Brower just going to See/Look for your Image file inside the Old Folder/Image path that you have given.
[bowser bhai ko nhi pta ki apne kha daali Apki image file
browser to sirf ye dekhega ki konsi location di hai IMG tag ke andar
or wha dhoondega apki image file ko]

[@hitarth9783]

Thx bro ho gaya 😀

[@shudocode]

@@hitarth9783 thanks for watching

[@12-b5yongcoullysisp.7]

BIIIIIIG THANKS WOOOOH !!!!!!!!!!!!! i thought it was fake vid shocks

[@shudocode]

Big Thank you for Watching :)

[@tanvikoneti]

thank you bro so much I had wasted my time before watching your video

[@shudocode]

I’m Glad I Could Help

[@okuhlesithole2608]

Sir i tried everything however still it's not working , it says " some pictures have been blocked to help prevent the sender from your computer" please assist .

[@shudocode]

To fix it
Goto control panel>windows defender>options>real-time protection then uncheck scan downloaded files and attachments.
After that ur problem will be fixed

[@okuhlesithole2608]

Thank you so much sir 🤗

[@vyomhirani9593]

thank you sirji
Very much

[@shudocode]

thanks for watching

[@aartisaxena9140]

Thank you sir for telling how to insert pictures

[@shudocode]

Aarti Saxena thanks for watching

[@aartisaxena9140]

Welcome dear

[@viralshorts-fz3hz]

tnx very much i needed this

[@shudocode]

Thanks for Watching

[@codingwithvinay8622]

Thank bro thank you very much ❤️❤️❤️♥️

[@shudocode]

Thanks for Watching

[@bryankamotho6038]

Thanks so much bro

[@shudocode]

Thanks for Watching

[@skaya6267]

thankyou!!!

[@shudocode]

thanks for watching

[@gayathriv5710]

Thank you soo much sir

[@shudocode]

Thanks For watching :)

[@magicinlogic3538]

Thanks bro you are great 🤘🤘

[@shudocode]

no no, thank you for watching

[@Assis6]

thank you

[@shudocode]

Thanks for Watching

[@pawandhanushka2805]

thanks its work

[@shudocode]

pawanaya sl thanks for watching

[@misdiarios]

Sir can u tell how to add image in html without notepad

[@shudocode]

Notepad is a Text editor
So if you don't want to use it
It's fine
But at the end need a CodeEditor/text editor to write HTML CODE
Like IMG tags for inserting images inside HTML Document

[@SiromeTube]

Tnx

[@shudocode]

Thanks for Watching
GoodDay

[@SiromeTube]

Bro i need help, can you help me.???

[@shudocode]

@SiromeTube sure. How can I help
Edit: its 2AM here
So tomorrow remind me
Will talk over googleMeet and try to fix ur issue
Night

[@SiromeTube]

@@shudocode pls knok me in my whatsapps. if u have send me ur whatsapps num

[@shudocode]

@@SiromeTube i am free rightnow
If you free too
I can send you a googleMeet link

[@uhhhhno-9546]

THANK YOU SO MUCHH

[@shudocode]

thanks for watching

[@yuben6727]

Bro can u insert images in notepad? Replay me

[@shudocode]

If you are talking about multiple images
Then yes we cab insert multiple images using Notepad
Just use multiple IMG tags like this

[@yuben6727]

@@shudocode I'm saying insert images in notepad, not using notepad

[@shudocode]

@@yuben6727 sorry
You can't do that
Notepad is a text editor
You can't add images there

[@yuben6727]

@@shudocode replay??😂

[@yuben6727]

@@shudocode ok bro

[@theartpencilindia]

Sir can you please tell how to align image in html.

[@shudocode]

to assign HTML contents we have to use CSS align properties
where you have to select Parent Div
like
but if you dont have a parent Div
then i suggest you to use
float: left;
for aligning your IMAGE to the Left
or
float: right;
to align your Image to the Right
there are other css Properties like align-content and align-self
you should check them out also

[@theartpencilindia]

@@shudocode thank you sir it proved a best help for me.

[@shudocode]

I am glad to hear it

[@lalitjagtap4967]

Sir can you please make a video on image map?? Please sir

[@shudocode]

i am working on it. Thanks for Watching :)

[@shudocode]

Here is your Requested Video
ua-cam.com/video/tf_M43oazGo/v-deo.html
Sorry for the Delay

[@bhavyagupta9838]

I am having problems in inserting images

[@shudocode]

if your code is not working then make sure Your written Image file name “image.jpg” is correct.
OR
Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/image.jpg")
and paste that path inside your HTML Image tag
Example

if this still not working
then add file:/// before your File Path
like this:

[@aaronroco8056]

UID:9067
thank you i'll wait for this till tomorrow.

[@shudocode]

check your mail

[@shudocode]

mail content:
Your CODE seems alright
if your code is not working then make sure Your written Image file name is correct.
OR
Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" TAB Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/imageName.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@anamikamishra2152]

Sir image doesn't work

[@shudocode]

please aap is link pe apna HTML code submit kr lijiye. Like : programminghead.com/help/ fir mein aapka code check krke bata hu ki kya problem hai

[@mahimapandeybhiwandi1234]

Its not working

[@shudocode]

i am sorry to hear that. can you please send your code to my Email address so i can take a look at it
EmailAddress: [e-mail]

[@jenibelleeuphrosynesanchez1507]

UID :5429 help me please I have this project and the due of it is until tom, thank you

[@shudocode]

please check your email
email content:
please remove spaces in your file path
wrong
right
if your code is not working then make sure Your written Image file name is correct.
OR
Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" cab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/Pastel GIF.gif")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@aarushisingh9089]

UID :3411 fix my pblm

[@shudocode]

Your code seems Alright
but if your code is not working then
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML//images/image2.jpg")
and paste that path inside your HTML Image tag
Example

if this still not working
then add file:/// before your File Path
like this:

[@leonardomar6675]

UID:4406
thank you in advance

[@shudocode]

please check your email le***********[e-mail]

[@bellahadidnt.]

UID :7409
thank you :)

[@shudocode]

andikan please check your Email a*********[e-mail]

[@harshiniesubramaniam3281]

UID :9387
Thanks

[@shudocode]

you suppose yo use Double Quotes " " instead of double single Quotes ' ' ' '
please try this
Otherwise Your code seems Alright
but if your code is not working then make sure Your written Image file name “logo.jpg” is correct.
OR
Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/logo.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@harshiniesubramaniam3281]

@@shudocode Thanks a lot

[@shudocode]

@@harshiniesubramaniam3281Thanks for Watching

[@upwasingh821]

2895 pls fix

[@shudocode]

Your SYNTAX was wrong
Please use
Still not working?
Then CHECK YOUR EMAIL u*****[e-mail] for more Details

[@jaffmhielangayon1388]

UID :1379

[@shudocode]

Your code seems Alright but
if your code is not working then make sure Your written Image file name “White T-Shirt.jpg” is correct.
OR Image file is Present at the same folder where your HTML file is you can move that Image file to the same location (where your HTML file is)
OR you can put here the full path
to get the Full path of your Image file Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this
"C:/user/Desktop/HTML/White T-Shirt.jpg")
and paste that path inside your HTML Image tag Example
if this still not working then add file:/// before your File Path like this:

[@leonardomar6675]

9271
still not working TvT

[@shudocode]

hi... your file source is correct.. and everything looks ok..
if u have googleMeet or Zoom then i can personally take a look into your problem and try to fix it

[@agentyt5251]

UID :8458
Fix My problem

[@shudocode]

please check your email
mail content:
Your code seems alright
but if your code is not working then make sure Your written Image file name is correct.
OR
Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" cab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/Photo.png")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@bryangamat4141]

UID :7822

[@shudocode]

Your code seems Alright
but if your code is not working then make sure Your written Image file name “cat.jpg” is correct.
OR
Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/cat.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@bryangamat4141]

@@shudocode THANKYOUUUUU SIR MY WORK WAS DONE NOW BY YOUR GUIDE I SUPER APPRECIATE IT AND MY REPORT NOW WAS COMPLETE AND SOLID THANKYOUSOMUCHHHHHH SIR BE SAFE ALWAYS

[@shudocode]

@@bryangamat4141 glad to hear it

[@abhishekpurkar4023]

2816

[@shudocode]

Your code seems Alright
but if your code is not working then make sure Your written Image file name “s.jpg” is correct.
OR Image file is Present at the same folder where your HTML file is you can move that Image file to the same location (where your HTML file is)
OR you can put here the full path
to get the Full path of your Image file Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/s.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working then add file:/// before your File Path like this:

[@violet0176]

UID:6305
please fix my problem

[@shudocode]

check your email

[@violet0176]

@@shudocode Thank you so much it helped me a lot

[@shrutikamahajan3961]

7171

[@shudocode]

please don't use double single quoted ' ' path ' '
and also add slash after the image name
wrong code :
use it like this
still not working??
then check your email for more help

[@abhishekpurkar4023]

2816 fix my code

[@shudocode]

Your code seems Alright
but if your code is not working then make sure Your written Image file name “s.jpg” is correct. OR Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR you can put here the full path
to get the Full path of your Image file Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab
Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/s.jpg") and paste that path inside your HTML Image tag
Example
if this still not working then add file:/// before your File Path like this:

[@renejoyrebota7181]

UID :5041

[@shudocode]

Try adding file:///
Like
If still not working
I will help u using google meet

[@Raine20003]

UID :1758 PLEASE fix

[@shudocode]

Please check your Email r*********[e-mail]

[@pranavjha5328]

UID 5349

[@shudocode]

Remove space or change IMAG2063 .jpg
To
IMAG2063.jpg
Use this code
Otherwise your code seems Alright
but if your code is not working then
make sure Your written Image file name “IMAG2063.jpg” is correct.
OR
Image file is Present at the same folder where your HTML file is you can move that Image file to the same location (where your HTML file is)
OR you can put here the full path
to get the Full path of your Image file Follow These steps =>
Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and
copy the full path
(which will look like this "C:/user/Desktop/HTML/IMAG2063.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working then add file:/// before your File Path like this:

[@soniakumarivlogger2391]

Uid 3105

[@shudocode]

Your code seems Alright
but if your code is not working then make sure Your written Image file name “celldiagram.jpg” is correct.
OR
Image file "celldiagram.jpg" is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/celldiagram.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@lachishia8525]

help me UID :5546

[@shudocode]

Your code seems Alright
but if your code is not working then make sure Your written Image file name “Facebook-logo.png” is correct.
OR
Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab
Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/Facebook-logo.png")
and paste that path inside your HTML Image tagExample
if this still not working
then add file:/// before your File Path
like this:

[@btrb3576]

6121

[@shudocode]

Your code seems Alright
but if your code is not working then make sure Your written Image file name “presentation1.jpg” is correct.
OR
Image file "presentation1.jpg" is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/presentation1.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@Ceenavlogs]

UID :8387 img not working

[@shudocode]

Please try this IMG tag
but if your code is not working then make sure Your written Image file name “ADO_7718.jpg” is correct.
OR
Image file "ADO_7718.jpg" is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/ADO_7718.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@chanchalaghn6358]

ULD:5308

[@shudocode]

You are using an .JFIF image so make sure that u test to run your HTML file in different web browsers (some might not support the .jfif image files)
Still not working then try full image path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/download (1).JFIF")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:
Still not working?
Then use .jpg or .png image

[@subhaykumar6085]

UID :8383
sir please fix my problem

[@shudocode]

sir. You are using FullImagePath. Your image should be there. But if its not there please use file:/// before your image path.
Like this
and please check your Email for full Code or more help

[@pokemonallseasons1864]

UID :2427 fix my Code

[@shudocode]

You forgot to add " after your File Source
please write you IMG tag like
Otherwise your code seems Alright
but if your code is not working then make sure Your written Image file name “gandhi.jpg” is correct.
OR
Image file "gandhi.jpg" is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/gandhi.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@anandanvenkatachalamparasu6108]

UID:1686

[@shudocode]

Sir you have misspelled SRC with SCR
Please correct that

[@gameingwithvivek6944]

UID :8167

[@shudocode]

Please check your Email

[@gameingwithvivek6944]

@@shudocode ok

[@ii___sak2634]

8465

[@shudocode]

Sir you have misspelled SRC with scr (your wrong code src="LogoMakr-8fxvBU.png")
Please correct this
Like :
Otherwise Your code seems Alright
but if your code is not working then make sure Your written Image file name “LogoMakr-8fxvBU.png” is correct.
OR
Image file is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" cab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/LogoMakr-8fxvBU.png")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this:

[@shannuthe_silent8875]

UID:2855

[@shudocode]

try this

[@shannuthe_silent8875]

@@shudocode okay. Thank you

[@shudocode]

@@shannuthe_silent8875 Thanks for Watching

[@roshinipriyadarshini8572]

UID:7397

[@roshinipriyadarshini8572]

Bro please help me soon I have presentation on Monday

[@shudocode]

Your code seems Alright
but if your code is not working then
make sure Your written Image file name “hall.jpg” is correct.
OR Image file is Present at the same folder where your HTML file is you can move that Image file to the same location (where your HTML file is)
OR you can put here the full path
to get the Full path of your Image file Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab
Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/hall.jpg")
and paste that path inside your HTML Image tag Example
if this still not working then add file:/// before your File Path like this:

[@roshinipriyadarshini8572]

Thank you bro it works

[@shudocode]

Thanks for Watching

[@deadshotgames2373]

UID :9944

[@shudocode]

please check your E-Mail

[@deadshotgames2373]

@@shudocode thank you for spending your time.

[@shudocode]

@@deadshotgames2373 thanks for watching

[@deadshotgames2373]

@@shudocode your welcome

[@pokemonallseasons1864]

UID :2427

[@shudocode]

You forgot to add " after your File Source
please write you IMG tag like
Otherwise your code seems Alright
but if your code is not working then make sure Your written Image file name “gandhi.jpg” is correct.
OR
Image file "gandhi.jpg" is Present at the same folder where your HTML file is
you can move that Image file to the same location (where your HTML file is)
OR
you can put here the full path
to get the Full path of your Image file
Follow These steps
=> Right click on your Image File
=> Select "Properties" from there
=> Under the "Security" tab Select and copy the full path
(which will look like this "C:/user/Desktop/HTML/gandhi.jpg")
and paste that path inside your HTML Image tag
Example
if this still not working
then add file:/// before your File Path
like this: