Question

我很难确定如何设置初始比例，以便网站在所有不同的浏览器，操作系统和设备上看起来都很好。我的网站有一个main.css文件，然后根据您拥有的设备包含其他文件，如mobile.css和tablet.css。

我有一个键值对的哈希表，其中键是浏览器+ OS +设备，值是初始比例值。在为视图指定适当的初始比例之前，我的控制器代码将确定您正在使用的浏览器+操作系统。这不是输出初始比例的好方法。

我想要一个以下任何一种解决方案：

只指定一个常量初始比例，与其他常量属性结合使用，可以很好地呈现网站
基于浏览器，操作系统和设备的其他属性派生适当初始比例的简单公式
一种在不使用初始比例的情况下在所有浏览器，操作系统和设备上一致地呈现网站的方法

以下是我遇到的示例问题：如果我将初始比例设置为1，它在Galaxy Note 1 + Stock浏览器+ Android4.0.4上呈现得很好，但在Galaxy Note 1 + Chrome + Android上却太大了4.0.4。换句话说，在相同的手机和相同的操作系统，但不同的浏览器，规模搞砸了！事实上，它在所有iOS设备上看起来也很丑陋。它在iPhone 6的iphone4S上太大了，在OS 1的iPad 1上稍大一点。

必须有一种更简单的方法来控制移动设备上的网站规模吗？

Answer 1

试试这个：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=1" />

<link rel="stylesheet" href="/Styles/tablet.css" media="screen and (max-width:800px)" />

<link rel="stylesheet" href="/Styles/mobile.css" media="screen and (max-width:480px)" />

如何设置初始比例，以便网站在所有设备的浏览器上很好地呈现

1 个答案: