通用应用程序中适用于 iPad 和 iPhone 的不同 CSS 样式表答案

【问题标题】：different CSS stylesheet for iPad and iPhone in universal application通用应用程序中适用于 iPad 和 iPhone 的不同 CSS 样式表
【发布时间】：2010-10-11 01:41:06
【问题描述】：

我有一个嵌入在 UIWebView 中的离线网站。我创建了一个样式表来很好地格式化 iPhone 屏幕上的所有内容，但我需要不同的格式来更好地利用 iPad 的屏幕。

我尝试使用代码简单地将不同的样式表复制到适当的位置，但这涉及修改应用程序包，这要么不鼓励，要么在这种情况下不起作用。

任何人都可以想出一种方法来根据应用程序是在 iPhone 还是 iPad 上运行来加载不同的样式表？我有数千个与网站同步的 HTML 文件，所以我不能很容易地修改所有这些文件。我需要一些方法来更改使用 javascript 加载的样式表或将 css 文件移动到某个位置。

我还应该提到，这是一个通用应用程序，在两者上运行的代码几乎完全相同（以及略有不同的 nib 文件）。

【问题讨论】：

标签： javascript iphone css ipad uiwebview

【解决方案1】：

你能用CSS media query吗？您可以使用 stringByEvaluatingJavaScriptFromString: 将其注入您的页面。

【讨论】：

这是我最近进行内部演示时采用的路线，效果很好。假设您的内容基本相同，而您只想设置不同的样式，这肯定是我所知道的最快的方法。
我会使用什么 javascript 来注入 CSS 链接？ innerHTML() 还是有更好的方法？（抱歉，对 DOM 不太熟悉。）
我的 JavaScript 生锈了。也许@Toji 可以提供一些指导。我不确定它是否速度快或内存效率高，但您也可以在将 HTML 加载到 Web 视图之前将其作为可变字符串进行操作。
为什么需要 javascript 来注入链接？使用正确的media 属性将它们硬编码到您的页面上，其余的由浏览器处理。
在问题中，Nimrod 说他不能轻易修改源文件。

【解决方案2】：

通过您的服务器端代码，您可以检测到iPad User Agent 并将link 标记写入不同的样式表。我可能会使用服务器端逻辑而不是 Javascript，只是因为我不喜欢使用 Javascript 执行此操作的“闪烁”的可能性。

【讨论】：

没有服务器端。 UIWebView 从应用程序包本地加载静态内容。基本上我使用 UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad 来检查我是否在 ipad 上执行然后做一些不同的事情（比如某些事情的当前弹出窗口）。我需要一些方法来类似地修改 UIWebView 以覆盖它默认加载的 CSS 文件。

【解决方案3】：

你为什么不看看 960 Grid System http://960.gs 。它有助于根据遇到的设备使用不同的 CSS 格式

【讨论】：