div class="one_answers">
我想为我的网站制作它，这是我的问题：
如果用户使用计算机查看我的网页，则 css 应该是
<link rel="stylesheet" href="/pc.css" type="text/css" media="all" />
但是如果他们使用移动设备，css 应该是
<link rel="stylesheet" href="/mobile.css" type="text/css" media="all" />
我将如何做。我想要html而不是php<</p>
您可以通过媒体查询做这样的事情
<link rel="stylesheet" media="screen and (min-device-width: 1024px)" href="pc.css" />
<link rel="stylesheet" media="screen and (max-device-width: 1024px)" href="mobile.css" />
如果你想走Javascript路线
function adjustStyle(width) {
width = parseInt(width);
if (width < 1024) {
$("#size-stylesheet").attr("href", "css/mobile.css");
} else {
$("#size-stylesheet").attr("href", "css/pc.css");
}
}
$(function() {
adjustStyle($(this).width());
$(window).resize(function() {
adjustStyle($(this).width());
});
});
在 CSS 中使用媒体查询完成此操作可能更可靠。由于某些浏览器未启用 JavaScript，尤其是移动浏览器，因此在没有 JavaScript 的情况下支持基本功能被认为是最佳实践。 请参阅Haylem的回答以获取更多信息。
CSS3 媒体查询的精彩解释可在这篇 SmashingMagazine.com 文章"如何使用 CSS3 媒体查询"中找到。在您的示例中，您可以按如下方式快速实现这一点：
<style>
@import url(/pc.css) (min-width:480px);
@import url(/mobile.css) (max-width:480px);
</style>
当然，这在古代版本的Internet Explorer中不起作用，因此您可能还需要考虑这一点：
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" media="all" href="/pc.css"/>
<![endif]-->
但是，如果您在响应式网页设计（RWD）方面没有丰富的经验，那么最好考虑使用像Foundation或Bootstrap这样的CSS框架。查看这篇 Mashable.com 文章以获得良好的概述。
您可能还想查看HTML5样板，该样板用于更全面的快速入门工具包INIT。