How to show and make image responsive using css in website [w/ subs]



00:00:05 – Welcome to DIGITAL LEARNING
00:00:07 – I will show you how to make responsive image like this
00:00:18 – Create a new folder
00:00:25 – i'm renaming it to responsive image
00:00:29 – Till now its EMPTY
00:00:33 – i'm moving these image to responsive image folder
00:00:42 – Now open your Html editor
00:00:49 – Here i'm using Notepad++
00:00:51 – Now save this page in your created folder
00:00:59 – Now save your page as html
00:01:10 – save as HTML extension
00:01:20 – Now i'm going to write a small coding for this
00:01:43 – inside body we need to show our image
00:01:52 – <img is the tag for image
00:01:54 – src is the source of the image or location of the image
00:01:58 – As we have your image in the same project folder so
00:02:02 – so there is no need to give full location of image here
00:02:11 – now check whether image is showing or not
00:02:14 – Run this page in chrome or any browser
00:02:22 – Yet it's unresponsive, check it by resizing your browser
00:02:27 – yes its unresponsive
00:02:29 – we need to make it responsive
00:02:48 – give its height “auto” and width “100%”
00:02:59 – Now check it again in your browser
00:03:11 – yes its responsive now
00:03:16 – Please like and subscribe my video if you found it cool
00:03:26 – Thanks for watching


Video Url:
http://youtu.be/J44mg4wR4xg

Comments

comments