文章内容
2023/7/26 19:41:02,作 者: 黄兵
css media 查询屏幕大小划分
在使用 css 媒体查询的时候，屏幕大小划分是一个很头疼的问题，参考了其它项目对于屏幕大小的划分，方案如下：
@media (min-width: 576px) {}
@media (min-width: 768px) {}
@media (min-width: 992px) {}
@media (min-width: 1200px) {}
@media (min-width: 1400px) {}
@media (max-width: 575.98px) {
.name-sm{}
}
@media (max-width: 767.98px) {
.name-md{}
}
@media (max-width: 991.98px) {
.name-lg{}
}
@media (max-width: 1199.98px) {
.name-xl{}
}
@media (max-width: 1399.98px) {
.name-xxl{}
}
同时也对 样式的命名做了示例。
如果有任何问题，欢迎下面留言讨论。
评论列表