201509280825_ "Css3--media query finishing 2"

1, Smartphones (vertical board and horizontal plate)

@media only screen and (min-device-width:320px) and (max-device-width:480px) {/* Your style is written here */}

2, Smartphones (horizontal board)

@media only screen and (min-width:321px) {/* Your style is written here */}

3, Smartphones (vertical board)

@media only screen and (max-width:320px) {/* Your style is written here */}

4. IPad (vertical panel and flat panel)

@media only screen and (min-device-width:768px) and (max-device-width:1024px) {/* Your style is written here */}

5. ipad Flat Panel

@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (Orientation:landscape) {/* Your style is written in this */}

6, the ipad's vertical board

@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait) {/* Your style is written in this */}

7, desktops and laptops

@media only screen and (min-width:1224px) {/* Your style is written here */}

8, Large Screens

@media only screen and (min-width:1824px) {/* Your style is written here */}

9, IPone4

@media only screens and (-webkit-min-device-pixel-ratio:1.5), only screens and (min-device-pixel-ratio:1.5) {/* Your style is written here */}

10. IPhone4 Vertical Board

@media only screens and (-webkit-min-device-pixel-ratio:1.5) and (orientation:portrait), only screen and (Min-device-pixe l-ratio:1.5)  and (orientation:portrait) {/* Your style is written here */        }

11, IPhone4 Horizontal Board

@media only screens and (-webkit-min-device-pixel-ratio:1.5) and (Orientation:landscape), only screen and (Min-device-pix el-ratio:1.5)  and (Orientation:landscape) {/* Your style is written here */}

12. IPad 3 Media Query

and (min-device-and (max-device-and(-webkit-min-device-pixel-2) {  

/* Your style is written here */
               }

201509280825_ "Css3--media query finishing 2"