15: How to Insert Images Using HTML and CSS | Learn HTML and CSS | Full Course For Beginners

How to insert images using HTML and CSS | Learn HTML and CSS | HTML tutorial | Basics of CSS. In this lesson we will learn how to create an HTML image in our website page. We will learn how to insert images using HTML and we will learn how to insert images as a CSS background image, which also allow for us to create banners.

➤ GET ACCESS TO MY LESSON MATERIAL HERE!

First of all, thank you for all the support you have given me!

I am really glad to have such an awesome community on my channel. It motivates me to continue creating and uploading content! So thank you!

I am now using Patreon to share improved and updated lesson material, and for a small fee you can access all the material. I have worked hard, and done my best to help you understand what I teach.

I hope you will find it helpful :)

[krisencina]

For those having trouble in seeing their image, place the folder where the image is located to the same folder of the html document you are trying to place the image on. Worked for me.

[fizzy]

OH MY GOD, THANK
NOBODY WOULD FRIGGIN' EXPLAIN WHERE I NEEDED ALL MY FILES AND STUFF, AND IT HAS TAKEN ME ALMOST A WHOLE DAY TO FIGURE OUT HOW TO GET IMAGES IN THE BACKGROUND OF MY THANK YOU, THANK YOU, THANK <3

[rabsfeir]

Dude, there are good videos out there and i learned a lot, but yours is so well structured and how you split your videos... Thank you

[fotornx]

THANK YOU SOO MUCH!
I COULDNT FIGURE OUT HOW TO INCLUDE IMAGES SO THEY ARE RESIZEABLE BUT NOW I KNOW!
MY WEBSITE PROGRESS MIGHT HAVE BEEN AS GOOD AS DEAD WITHOUT YOU!

[edwardnorton]

This is the best video that I've come across. All videos should be made this way. Straight to the point and well explained. Thank you.

[dcandleonna]

thank you so much for this video, you have no idea how much you've helped!

[tolevnu]

Brother I thank you for your wonderful 👍🏻😊 explanatory video 📷
I just came across your video on YouTube as a beginninger in HTML and I think 💬🤔 I'm humble to learn from you brother 🥰✅

[mb]

Thanks a lot!! this videos had helped me so much! better than the coursera videos where they talk and talk introduction and never go to the point of teaching. You are a great teacher!

[koko]

About the fourth of the image, It's about the resolution, if you have 1280x720 you divide 1280/4 = 320 width and 720 / 4 = 180 height
henceforth 320x180 its a 1/4 of the whole image ... It could be pretty basic and easy to understand, but I found it my way so I hope it helps someone.


Cheers

[bossful]

guys as for me i made a very dumb mistake which made me suffer for almost a week, the mistake was
i saved the folder as "images" but when i wrote it down on my text editor i wrote "img"
a simple mistake of not paying close attention like this can be very frustrating


thank you for the video btw

[aadrikasingh]

After seeing almost 10-20 videos on how to add found the solution in this video. Thankyou!!!

[oreojustinvlogs]

Thanks a lot Sir, these tutorials helped me a lot about Inserting Images and other functions using CSS! God Bless Sir and more power to your channel

[kv]

I am so happy I found this channel, I have struggled a lot before with inserting images but now I can after watching this video, your work is well structured and very helpful even to people like me who are new to coding...thank you so much

[AgnaldoC]

Best video ever. Thanks for that, this was so confusing to me

[arnoldjohnalcaraz]

For those who keep in questioning about the image is not shown in the web page.
Make sure that your folder, where your image is, placed at the same file where your HTML file is.

[geraldaquino]

just started learning programming at my late age. this tutorial is really helpful.

[joedavidson]

damn bro, i've been searching for this on AI for hours and then you soled my problem in 1 minute

[guilhermegarcia]

if you're still having problems with the div class background-image not showing, even after correctly stating the img path, try ctrl + shift + R for refreshing your page. Seems like most browsers mess up the cache when dealing with urls.

[iQuickest]

i was in the process of learning html and some basic css, while watching this videos, i already knew some of the stuff but with this videos it help me so much to understand it more and now i feel more fluent on html and css i understood the concept of it pretty quick, i learned python in 2/3 weeks with 2 to 3hours a day but still need to do projects to understand how it works more, while front-end i'd say its quite simple, but learning javaScript its my next goal, i want to understand backend development, i learned python and understand most of the concept of it, now is there tutorials on how to set up a database or user storage to store their "credentials" by that meaning like email and password and remembering it or storing it, i some what know the code for it but still need practice, i know how to get user input from python using username = input("Enter username:")
print("Username is: " + username) but also confused on how when you login it would ask for the password, would you add the python or javascript Script? and is javascript or python better for backend or php? checked out some of your other videos and saw you use php as your backend language, any update on another language you would use today instead of php?

[kzuhairi]

your video just wow ! you make me amazed on how you teach people on this tutorial ! hope god bless you for this free tutorial ! love it so much !