css - デスクトップ版のレスポンシブサイズ?

Question

レスポンシブ サイトの初期の基本を設定しています。モバイルとタブレットのサイズを指定しましたが、デスクトップ バージョンをどうすればよいかわかりません。

モバイル

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

}

タブレット

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

}

これら 2 つはサイズに関して正しく設定されていますか (おおまかに業界標準に合わせて、そのようなものがないことを私は知っています!)? デスクトップに 1024px を超えるバージョンを指定するにはどうすればよいですか?

---

/* Mobile */
@media (min-width:320px) { 

    .tester {
        width:100%;
        height:500px;
        background-color:white;
    }
}

/* Tablet */
@media (min-width:640px) {

    .tester {
        width:100%;
        height:500px;
        background-color:red;
    }   

}

/* Desktop */
@media (min-width:960px) {

    .tester {
        width:100%;
        height:500px;
        background-color:blue;
    }   

}

Answer 1

どうぞ

@media (min-width:320px) { /* smartphones, iPhone, portrait 480x320 phones */ }
@media (min-width:481px) { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ }
@media (min-width:641px) { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ }
@media (min-width:961px) { /* tablet, landscape iPad, lo-res laptops ands desktops */ }
@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ }
@media (min-width:1281px) { /* hi-res laptops and desktops */ }