媒體查詢幫助，這些是正確的嗎？

Question

就目前的RWD網站正在構建，用於移動（iphone）媒體查詢/標籤（新iPad）/筆記本電腦屏幕（1366×768像素）是：

/* #Mobile (Portrait) 320px 
----------------------------------------------------------------------*/ 
@media only screen and (min-width: 100px) and (max-width: 479px) 

/* #Mobile (Landscape) 
----------------------------------------------------------------------*/ 
@media only screen and (min-width: 480px) and (max-width: 767px) 

/* #Tablet (Portrait) 
----------------------------------------------------------------------*/ 
@media only screen and (min-width: 768px) and (max-width: 959px) 

/* #Tablet (Landscape) 
----------------------------------------------------------------------*/ 
@media all and (min-width: 1400px) and (max-width: 1920px) 

/* Smaller than standard 960 (devices and browsers) and larger devices */ 
@media only screen and (min-width: 959px) and (max-width: 1177px) 

/* Desktops and laptops (laptop browser version styles) ----------- */ 
@media only screen and (min-width : 1224px) and (max-width: 1366px) 

難道這些是正確的正在使用？

Answer 1

是，還包括這些一個完美的RWD

// Little larger screen 
@media only screen and (min-width: 480px) { 

} 

// Pads and larger phones 
@media only screen and (min-width: 600px) { 

} 

// Larger pads 
@media only screen and (min-width: 768px) { 

} 

// Horizontal pads and laptops 
@media only screen and (min-width: 992px) { 

} 

// Really large screens 
@media only screen and (min-width: 1382px) { 

} 

// 2X size (iPhone 4 etc) 
@media only screen and 
     (-webkit-min-device-pixel-ratio: 1.5), only screen and 
     (-o-min-device-pixel-ratio: 3/2), only screen and 
     (min-device-pixel-ratio: 1.5) { 

} 如果你用無禮的話，這是我一直在使用一個小竅門：

$laptop-size: "only screen and (min-width: 768px)"; 
$desktop-size: "only screen and (min-width: 1382px)"; 

//等 然後

@media #{$laptop-size} { 
    // Styling here... 
}