css – hidden-xs hidden-sm里面的视频下载了吗？

我正在创建一个网站,在div中我有一个视频,但我不想在移动设备上显示这个视频,所以我使用hidden-xs和hidden-sm,到目前为止一切都很好.

但是,我的问题是,当我使用这些课程时,视频没有下载或只是没有显示？因为,他们之间存在巨大差异,考虑移动数据计划的数据消费.

使用Chrome上的开发工具,在网络选项卡上使用3g,无法显示是否已下载.

那么,如何100％确定使用什么？ hidden-xs和sm或CSS媒体查询？

而且,我完全知道有用的,但是,有一千个.所以我需要指定其中的每一个.我有一个代码片段,但我认为根本不是一个好主意……不幸的是……

干杯= D.

这是依赖于浏览器的情况.通常,即使在媒体查询中,浏览器也不会显示隐藏的内容.

并且为了防止视频下载,您将不需要JavaScript,简单地添加preload：none或preload：metadata(如果您想要检索有关文件的基本信息)作为视频属性.

报价从the <video> specification

preload = “none” or “metadata” or “auto” or “” (empty
string) or empty Represents a hint to the UA about whether
optimistic downloading of the video itself or its metadata is
considered worthwhile.

• “none“: Hints to the UA that the user is not expected to need the video, or that minimizing unnecessary traffic is desirable.
• “metadata“: Hints to the UA that the user is not expected to need the video, but that fetching its metadata (dimensions, first
  frame, track list, duration, and so on) is desirable.
• *”auto“: Hints to the UA that optimistically downloading the entire video is considered desirable.**
• Specifying the empty string is equivalent to specifying the value “auto”.