如何仅让特定<div>元素以桌面视图渲染而非整页？

之前一直使用meta标签渲染整页的桌面视图，但现在需要header和footer保持响应式，同时让class为'desktop'的

元素以桌面视图渲染。请问无需使用CSS是否可以实现？

对应的HTML结构：

<body>
<header> ... </header>
<div class="desktop"> Hello World! </div> 
<footer> ... </footer>
</body>

• 不行，没有CSS的话无法实现这个需求。
• 核心原因：meta标签是全局控制页面视口规则的，作用范围覆盖整个页面，没办法单独针对某个元素生效。比如你之前用来强制整页桌面视图的<meta name="viewport" content="width=1200">这类标签，会让整个页面的视口宽度固定，header和footer也会跟着变成桌面视图的表现，没法单独让它们保持响应式。
• 要达成需求必须借助CSS：
  • 保留全局的响应式视口meta标签（比如<meta name="viewport" content="width=device-width, initial-scale=1.0">），让header和footer自然适配不同屏幕。
  • 给.desktop元素添加CSS样式模拟桌面视图表现，比如设置固定宽度（如width: 1200px）、水平居中，或者针对该元素设置桌面端的专属布局规则。

内容的提问来源于stack exchange，提问作者Yassir Irfan