移动和桌面媒体查询优先级

Mobile and Desktop media query priority

我是前端 Web 开发的初学者。我想知道在桌面优先方法中编写 CSS 媒体查询时的优先顺序。我是不是先写移动查询,然后再写平板查询,这样:

/*Desktop CSS*/ /*Media query for tablet*/ /*Media query for Mobile*/

或反过来。

你可以在任何地方写,但如果你是初学者,那么我建议你为响应式创建一个单独的文件 CSS 这样你就不会感到困惑。 因此,在 style.css 桌面方法和 responsive.css 所有针对移动设备和平板电脑的媒体查询中。 Standered 媒体查询:

@media screen and (min-width: 1200px){} /* Desktop */
@media screen and (min-width: 1025px) and (max-width: 1199px){} /* small laptop */
@media screen and (min-width: 768px) and (max-width: 1024px){} /* tablet */
@media screen and (min-width: 575px) and (max-width: 767.98px){} /* tablet and large mobiles */
@media screen and (min-width: 320px) and (max-width: 480px){} /* Mobile*/

谢谢