How to write text on image using HTML and CSS

In this video tutorial, I am going to tell you how you can write some text on image by using HTML and CSS. Here I use CSS position attribute. By using position= absolute I break the flow of heading and place it in the middle of the banner image.

You can also see this video for:

text on image tutorial html and css

overlay text on image

text on image css

text over image html

how to add text on image in html

how to put text on image in html

 how to write text on image in html

 how to add text over image with html and css

 how to add text on image css html

 text over image with html and css

 text over image html and css

 add text over image using html and css

 text over image html css

 how to put text on image with html 2018

text on image

 text on image html

 write text on image

 webseotips

my another video links:

[chome]

How would you place two different text overlays? Two lines with different fonts/colors?

[kelly_browning]

Awesome!! Thank you so much for uploading this and for giving examples as you went along. Worked perfectly!

[jason]

What to do if it's in a table, and outlook can't render them correctly?

[danieljankulovski]

Thank you, im using Brackets but I still figured things out <3

[Aarav-G]

Thank you so much sir; I’m feeling jubilant

[walanjo]

Finally made a Home page thanks a bunch

[faizanansari]

Thank you very much for uploading this video.

[heraturcoaz]

Well my image it is half visible and takes too much space is above the text and the text under.

[pavithraraji]

Awesome !!!After a lot of video this video made my day🤩🙌

[animeshsingh]

Thanks for your video it helped me,
Only one problem it is not all devices compatible. Text is dislocated when i open in Mobile.
Please help me for that 👍🙏

[akashdudhat]

Sir to add download this edited image with providing button

[kayumkhan_kks]

sir text background ka ander ja rh ha text is not show

[-mendelsairalaneg.franci]

it works
but how about the paragraph?

[Nhat]

It good useful for my project ! thank you so much

[channelk]

Position :absolute
Or
Position: relative
What is difference

[sergemoulin]

Thank for your vidéo.
I just don't understand how to put the text a little bit more on the left or a little bit more on the right. Did someone know how to do this?

[kumararjun]

Awaj nahi hai ki ham kaise sangh ki kisliye UG hota hai

[ariellemurray]

I thought you weren’t supposed to mix content (html) and style(css)? Like keep HTML and CSS in two separate files.