Home > DeveloperSection > Forums > How to use responsive web design media queries in css
Ankit Singh

Total Post:341

Points:2389
Posted on    January-05-2016 10:11 PM

 CSS-CSS3 CSS-CSS3  Responsive Design  CSS 
Ratings:


 2 Reply(s)
 209  View(s)
Rate this:
I want to use  responsive web design media queries  in css.please help me.


aditya kumar Patel

Total Post:242

Points:1722
Posted on    January-05-2016 10:19 PM

Media queries are  simple filters which can be applied to CSS styles. They make it easy to change styles based on the device rendering the content, including the display type, width, height, orientation and even resolution.

use to like below code:

/*For Smartphones (portrait and landscape) ----------- */

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {

/* Styles */

}

 

/*for iPads (portrait and landscape) ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {

/* Styles */

}

 

/*For Desktops and laptops ----------- */

@media only screen and (min-width : 1224px) {

/* Styles */

}

 


Modified On Jan-05-2016 10:21:17 PM

Ankit Singh

Total Post:341

Points:2389
Posted on    January-05-2016 10:53 PM

if you want to use media queries in css  go to  https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries for more details.

Don't want to miss updates? Please click the below button!

Follow MindStick