본문 바로가기

FrontEnd/CSS

Media Query 설정

Desktop (1281px 이상)

@media (min-width: 1281px) {

//CSS

}

 

Laptop, Desktop (1025px ~ 1280px)

@media (min-width: 1025px) and (max-width: 1280px) {

//CSS

}

 

Tablet(세로) (768px ~ 1024px) 

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

//CSS

}

 

Tablet(가로) (768px ~ 1024px)

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

//CSS

}

 

Tablet(저해상도), Mobile(가로) (481px ~ 767px)

@media (min-width: 481px) and (max-width: 767px) {

//CSS

}

 

 

대부분의 Mobile(세로) (320px ~ 479px)

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

//CSS

}

 

'FrontEnd > CSS' 카테고리의 다른 글

Search Input - Expanding Event  (0) 2022.05.10
Button - Hover Event  (0) 2022.05.10