HTML链接：

<LINK REL="stylesheet" TYPE="text/css" MEDIA="(max-width: 1024px)" HREF="foo.css">

CSS：

@media all and (max-width: 1024px) {
    ......
}

我已阅读文档,我理解两种方法之间的明显区别.但是,以下是2个问题,如果您能澄清,我有疑问：

1)浏览器是否以不同于CSS媒体查询的方式处理HTML媒体链接？我的意思是,我知道如果在css中添加CSS媒体查询,所有css文件都会被下载到所有设备,并且当浏览器解释编译的css时,只有相应的媒体查询才会生效.但是,如果媒体链接是以HTML格式添加的,那么它是否意味着只有当指定宽度匹配的设备时,浏览器才会下载foo.css？与Css媒体查询相比,浏览器处理HTML媒体链接的方式是否有所不同,或者它们是否完全相同,只是添加到网页的方式不同？

2)假设foo.css还有1024px以外的较小宽度的媒体查询,如下所示：

body {
   padding: 10px;
}     
@media all and (max-width: 900px) {
    body {
       padding: 5px;
    }     
}    
@media all and (max-width: 800px) {
    body {
       padding: 0px;
    }     
}

如果使用HTML链接添加上述文件,如下所示：

<LINK REL="stylesheet" TYPE="text/css" MEDIA="(max-width: 1024px)" HREF="foo.css">

这会成为浏览器看待它的嵌套媒体查询吗？我不明白的是,如果使用html链接添加上述内容,我不知道浏览器是否真的会像这样看到它变得无效：

@media all and (max-width: 1024px) {
    body {
       padding: 10px;
    } 

    @media all and (max-width: 900px) {
        body {
           padding: 5px;
        } 

    }

    @media all and (max-width: 800px) {
        body {
           padding: 0px;
        } 

    }

}

所以我的问题是,如果我在使用HTML媒体链接添加的css文件中有进一步的媒体查询,那有效吗？

编辑：
我在桌面上使用chrome查看了开发人员工具,我可以看到即使从桌面设备浏览也会下载平板电脑文件：

1)因此对于问题1,是否可以安全地假设所有浏览器都包含较旧的浏览器并且移动浏览器执行相同的操作,即使它们被放置在HTML链接中也会下载所有文件？

2)对于问题2,我可以看到当浏览器屏幕调整为平板电脑宽度时,chrome确实使用了平板电脑css内的媒体查询.在html中链接为1024px的css文件被视为media =“(max-width：1024px)”.但那么,这不意味着平板电脑的css文件中的媒体查询实际上是嵌套的媒体查询吗？虽然它有效但不是逻辑错误吗？是否有一些更严格的浏览器不认为这是有效的？