, , , , , , , , , ,

Responsive web design makes your web page look good in all the devices e.g.  laptop, tablets, iPad, and mobile devices. It is very important for the web page to be accessible and readable on all screens to reach to the target market.

Responsive web design means developing web page using CSS and HTML to resize, hide, shrink and/or move the content to present the page in a better way that it looks good on any screen.

Responsive web design - desktop

Desktop version

Responsive web design - tablet or iPad

iPad/tablet version

Responsive web design - mobile

Mobile version

We can see the same web page in different screens in above images. In this web page, the main focus is to present the news and move/resize the other sections, links, advertisements etc. which depends on the space available after putting the main content.

The sample code:

CSS for media - respnsive web design

Click to enlarge

This is an effective way to call CSS file depending on the size of the screen.

Please comment or email to learn more or to get sample code.

Ref : http://www.w3schools.com

About Author: