css 如何使用min-with进行媒体查询?

e37o9pze  于 2022-12-01  发布在  其他
关注(0)|答案(2)|浏览(199)

`

@charset "UTF-8";
/* inport the basis style page */
@import url("body.css");
/* why is this not working???? */
/* import alternative style 500px*/
@media (min-width: 500px){
@import url("screen_layout_small.css");
}

`
文件:屏幕布局_小. css

@charset "UTF-8";

body {
    background-color: red;
}

`
当URL(“screen_layout_small.css”)不在@媒体中时,它不起作用(当它不在响应命令中时,它起作用)
加载css文件screen_layout_small.css(当大小最小为500或更大时),然后加载screen_layout_small.css
顺便说一下,它不mather如果我使用最小或最大与。文件不加载在@媒体!!!

3htmauhk

3htmauhk1#

我认为错误出在语法上。

@charset "UTF-8";
/* inport the basis style page */
@import url("body.css");
/* why is this not working???? */
/* import alternative style 500px*/
@media screen and (min-width: 500px){
@import url("screen_layout_small.css");
}
mxg2im7a

mxg2im7a2#

我认为您使用了错误的语法。应该是:

@import url|string list-of-mediaqueries;

因此,在您的情况下,它应该是:

@import "screen_layout_small.css" screen and (min-width: 500px);

相关问题