@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 980px) {
}
@media only screen and (max-width: 800px) {
}
@media only screen and (max-width: 780px) {
}
@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 720px) {
}
@media only screen and (max-width: 640px) {
}
@media only screen and (max-width: 600px) {
}
@media only screen and (max-width: 568px) {
}
@media only screen and (max-width: 563px) {
}
@media only screen and (max-width: 549px) {
}
@media only screen and (max-width: 534px) {
}
@media only screen and (max-width: 480px) {
}
@media only screen and (max-width: 414px) {
}
@media only screen and (max-width: 411px) {
}
@media only screen and (max-width: 375px) {
}
@media only screen and (max-width: 360px) {
}
@media only screen and (max-width: 338px) {
}
@media only screen and (max-width: 330px) {
}
@media only screen and (max-width: 320px) {
}
Ngoài ra khi bạn bạn có thể thêm các kích thước khác tùy theo cách của bạn cũng như làm sao cho nó hợp với website hơn. Cách trên khá dài nhưng bạn cũng thể viết ngắn gọn như sau
@media only screen and (min-width:360px) and (max-width: 480px) {
}
Ỹ nghĩa của cách viết gọn này là hiển thị từ màn hình 360px đến màn hình 480px.