Wednesday, 16 July 2014

CSS Media Queries for Standardd Devices (SmartPhones, Ipads, Desktops, Laptops, )

CSS Media Queries for Standardd Devices (SmartPhones, Ipads, Desktops, Laptops, )
 
Looking for CSS Media queries for Devices ? 
 
Here you can find the CSS Media queries for all standard devices: 
 
/* Smartphones (portrait and landscape) ------ */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Define Styles here*/
}

/* Smartphones (landscape) ------ */
@media only screen 
and (min-width : 321px) {
/* Define Styles here*/
}

/* Smartphones (portrait) ------ */
@media only screen 
and (max-width : 320px) {
/* Define Styles here*/
}

/* iPads (portrait and landscape) ------ */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Define Styles here*/
}

/* iPads (landscape) ------ */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Define Styles here*/
}

/* iPads (portrait) ------ */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Define Styles here*/
}

/* Desktops and laptops ------ */
@media only screen 
and (min-width : 1224px) {
/* Define Styles here*/
}

/* Large screens ------ */
@media only screen 
and (min-width : 1824px) {
/* Define Styles here*/
}

/* iPhone 4 ------ */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Define Styles here*/
}

2 comments:

  1. Very nice post here thanks for it .I always like and such a super contents of these post.Excellent and very cool idea and great content of different kinds of the valuable information's.

    Seo Training in Chennai

    ReplyDelete
  2. I am very happy when read this blog post because blog post written in good manner and write on good topic. Thanks for sharing valuable information.
    SEO Company in Bangalore, SEO Services in Bangalore

    ReplyDelete