CSS Media Query

/* 스마트폰에서만 적용되는 CSS. HTC Desire HD는 가로 모드에서 폭이 533px. */
@media only screen and (min-device-width:320px) and (max-device-width:569px) {
    /* style */
}
 
/* 스마트폰 가로 */
@media only screen and (min-width:480px) {
    /* style */
}
 
/* 스마트폰 세로 */
@media only screen and (max-width:320px) {
    /* style */
}
 
/* iPhone 4 등 고해상도 */
@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) {
    /* style */
}
 
/* iPad 가로 */
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape) {
    /* style */
}
 
/* iPad 세로 */
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait) {
    /* style */
}