frontend-coder
5/25/2017 - 11:24 AM
My basic Interrupt point for adaptive layout
My basic Interrupt point for adaptive layout
/*========== SHORT LIST BREAK POINT Bootstap Grid ==========*/
@media only screen and (max-width : 1024px) {
}
@media only screen and (max-width : 768px) {
}
@media only screen and (max-width : 568px) {
}
@media only screen and (max-width : 425px) {
}
@media only screen and (max-width : 360px) {
}
/*========== MIDDLE LIST BREAK POINT Bootstap Grid ==========*/
@media only screen and (max-width : 1190px) {
}
@media only screen and (max-width : 1024px) {
}
@media only screen and (max-width : 992px) {
}
@media only screen and (max-width : 768px) {
}
@media only screen and (max-width : 667px) {
}
@media only screen and (max-width : 568px) {
}
@media only screen and (max-width : 425px) {
}
@media only screen and (max-width : 360px) {
}
/*========== FULL LIST BREAK POINT ==========*/
Basic Interrupt point for adaptive layout
/*========== Desktop First Method ==========*/
@media only screen and (max-width : 1440px) {
}
/* Large Devices, Wide Screens от 0 до 1190 пикселей md*/
@media only screen and (max-width : 1190px) {
}
@media screen and (max-width: 1080px) {
/* все стили которые работают на экранах с ширринов в 1024 пикселей */
}
@media screen and (max-width: 1024px) {
/* все стили которые работают на экранах с ширринов в 1024 пикселей */
}
/* Medium Devices, Desktops от 0 до 992 пикселей sm*/
@media only screen and (max-width : 992px) {
}
@media screen and (max-width: 800px) {
/* все стили которые работают на экранах с ширринов в 800 пикселей */
}
@media screen and (max-width: 768px) {
/* все стили которые работают на экранах с ширринов в 768 пикселей */
}
@media screen and (max-width: 667px) {
/* все стили которые работают на экранах с ширринов в 667 пикселей */
}
@media screen and (max-width: 600px) {
/* все стили которые работают на экранах с ширринов в 600 пикселей */
}
@media screen and (max-width: 568px) {
/* все стили которые работают на экранах с ширринов в 568 пикселей */
}
/* Extra Small Devices, Phones 0 до 480 пикселей */
@media only screen and (max-width : 480px) {
}
@media screen and (max-width: 425px) {
/* все стили которые работают на экранах с ширринов в 414 пикселей */
}
@media screen and (max-width: 384px) {
/* все стили которые работают на экранах с ширринов в 384 пикселей */
}
@media screen and (max-width: 360px) {
/* все стили которые работают на экранах с ширринов в 375 пикселей */
}
@media screen and (max-width: 320px) {
/* все стили которые работают на экранах с ширринов в 320 пикселей */
}
/* от 992 до 1199 пикселей */
@media only screen and (min-width : 992px) and (max-width: 1199px) {
}
/* от 768 до 991 пикселей */
@media only screen and (min-width : 768px) and (max-width: 991px) {
}
/* от 491 до 767 пикселей */
@media only screen and (min-width : 481px) and (max-width: 767px) {
}
/* от 321 до 480 пикселей */
@media only screen and (min-width : 321px) and (max-width: 480px) {
}