Sunday 24 November 2013

Responsive CSS web design examples with code

Responsive style template is today is very popular. Responsive means when you open website in your any of device like ipad, mobile, PC, etc. it will set it’s design as per your device’s screen size. Responsive style also called liquid design. Many popular site are responsive today. Here I have written three line code for setting up different CSS for all different devices. You just require to make three CSS files and set this code in your HEAD of site code. 

Links of CSS

Create files and use this code in your HEAD of html code. There is media screen width given and you can change its max and min width as per required. 
<link rel='stylesheet' href="style.css/"  />  <!--common CSS-->
<link rel='stylesheet' media='screen and (max-width: 480px)' href="style_mobile.css" />  <!--mobile css-->
<link rel='stylesheet' media='screen and (min-width: 481px) and (max-width: 768px)' href="style_ipad.css" />  <!--ipad css*-->

Download Demo

No comments:

Post a Comment