CSS3 Media Queries代码,Css代码库,德仔网

代码语言

代码分类

【Css】 CSS3 Media Queries

作者:Dezai.CN / 发布于2012/12/19/ 595

CSS3 Media Queries （这个不常用主要用于智能设备的判断显示不同的媒体）

/* Smartphones (portrait and landscape) ----------- */
 @media only screen
 and (min-device-width : 320px)
 and (max-device-width : 480px) {
 /* Styles */
 }
  
 /* Smartphones (landscape) ----------- */
 @media only screen
 and (min-width : 321px) {
 /* Styles */
 }
  
 /* Smartphones (portrait) ----------- */
 @media only screen
 and (max-width : 320px) {
 /* Styles */
 }
  
 /* iPads (portrait and landscape) ----------- */
 @media only screen
 and (min-device-width : 768px)
 and (max-device-width : 1024px) {
 /* Styles */
 }
  
 /* iPads (landscape) ----------- */
 @media only screen
 and (min-device-width : 768px)
 and (max-device-width : 1024px)
 and (orientation : landscape) {
 /* Styles */
 }
  
 /* iPads (portrait) ----------- */
 @media only screen
 and (min-device-width : 768px)
 and (max-device-width : 1024px)
 and (orientation : portrait) {
 /* Styles */
 }
  
 /* Desktops and laptops ----------- */
 @media only screen
 and (min-width : 1224px) {
 /* Styles */
 }
  
 /* Large screens ----------- */
 @media only screen
 and (min-width : 1824px) {
 /* Styles */
 }
  
 /* iPhone 4 ----------- */
 @media
 only screen and (-webkit-min-device-pixel-ratio : 1.5),
 only screen and (min-device-pixel-ratio : 1.5) {
 /* Styles */
 }

试试其它关键字

　Media　　Queries　

同语言下

可能有用的

Dezai.CN贡献的其它代码(4037)