Справочники, инструменты, документация

CSS: Медиа запросы для основных типов экранов

Памятка с медиа запросами для основных типов экранов.

Bootstrap 4.5 Grid

@media (max-width: 540px ) {
}

@media (min-width: 540px) and (max-width: 720px) {
}

@media (min-width: 720px) and (max-width: 960px) { 
}

@media (min-width: 1140px) {
}

Более гибкий вариант

/* Large desktops and laptops */
@media (min-width: 1200px) {
}

/* Portrait tablets and medium desktops */
@media (min-width: 992px) and (max-width: 1199px) {
}

/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
}

/* Landscape phones and portrait tablets */
@media (max-width: 767px) {
}

/* Landscape phones and smaller */
@media (max-width: 480px) {
}

/* Small phones */
@media (max-width: 320px) {
}