想出如何制作单独的css，以便在移动使用的情况下使用，这很酷。是这样的：
<link href="mobile.css" rel="stylesheet" type="text/css" media="only screen
and (max-device-width: 480px)" />
对于像iPhone和Galaxy这样的大多数普通智能手机来说，设置像素是否安全？我不想要多个移动参考，只有一个可以覆盖所有移动参考。上面的代码基本上是说，像素宽度480以下的任何东西都会转到那个css ref？
非常感谢。
答案 0 :(得分：0)
不，这在服务于所有设备方面并不完全安全。理想情况下，您希望响应式设计也能处理平板电脑，而不仅仅是智能手机，平板电脑用户通常无法访问鼠标。最常见的平板电脑分辨率是768x1024（对我而言，这是平板电脑流量的75％左右，我的网络流量总量超过6％，而且还有一些较大的手机）并且有一些奇怪的智能手机（弥补一下）占总流量的1-2％）在500-600分辨率范围内。
一般情况下，我建议使用max-width而不是max-device-width，因为它会在桌面上的小窗口中将网站折叠为移动格式，这最终对用户更有用。
在我看来，最佳做法不是使用单独的移动样式表，而是使用CSS媒体查询来使网页设计的元素响应，您可以在单个样式表中执行此操作。然后，您可以将某些元素折叠为特定宽度的单列布局，将其他元素折叠为其他宽度，再次使用max-width但在单个元素上使用它。
这使您可以充分利用中间宽度。某些双列布局或水平菜单在平板电脑上看起来很好，有些则需要折叠到单个列或隐藏的垂直移动菜单。每个元素的宽度都很小巧，您将获得灵活的设计，可以在所有设备上实现最佳效果。
这样您就不会尝试猜测设备类型，只需根据窗口宽度逐个元素重新设计。你也可以取消“只有屏幕”。