我可以使用 css 禁用 <script> 标签进行媒体查询吗？

Posted 2023-03-08

【中文标题】我可以使用 css 禁用 <script> 标签进行媒体查询吗？

【英文标题】：Can i disable <script> tag using css for media queries [duplicate]

【发布时间】：2022-01-14 10:44:36

【问题描述】：

在制作仅适用于桌面的网站并在移动设备上查看时，我希望浏览器发出警报以显示“无法在移动设备中查看！” 我尝试了以下方法-

script 
    display: none;
    pointer-events: none;

但即使尝试将类和脚本放在 div 中，然后提供类等等，这些也不起作用。警报总是显示在桌面视图中！！ 有没有可能？

【问题讨论】：

我认为 CSS 不会影响 JS 的运行。尝试改用matchMedia，就像在 JS 中使用媒体查询一样。

使用Detecting a mobile browser即可，如果是手机浏览器，其余代码不要执行

那行不通。

默认情况下，<script> 已经是 display: none;。没有影响<script> 执行 的CSS 属性。无论如何，那个用例似乎很奇怪。您提到媒体查询，那么为什么不创建一个适用于移动设备和桌面的响应式设计呢？手机有什么难点？好像是XY problem。

您如何定义“移动” - 视口尺寸或其他功能？

【参考方案1】：

如果我没看错的话，你想在移动设备上显示一些东西，但在桌面设备上隐藏它？如果是这样，这可以使用media queries 来实现。

@media screen and (min-width: 768px) 
  .hide-on-mobile 
    display: none;
  

<div class="hide-on-mobile">
  <p>Code to hide</p>
</div>

【讨论】：

不，我想禁用移动视图的脚本标签