1.一个网站所有浏览器。
正如@Tak 提到的，这里的答案是“渐进增强”和“优雅降级”。然而，他给出的定义并不完全正确。以下是正确的：
'Progressive enhacement' (see link) 意味着您首先使用久经考验的技术为旧浏览器编写代码（IE6/7 带/不带 JavaScript 是一个很好的起点）作为 HTML4 和 CSS1，然后随着您在支持 CSS3 和大部分 HTML5 的移动设备上的更现代浏览器上的测试进展到 Chome 和 Safari，添加增强功能。通过这种方式，您的目标是为任何浏览器提供其支持的最佳功能组合（顺便说一下，它永远不会完美，因此请记住80/20 rule 以避免将项目运行到地面）。
'优雅降级' (see link) 有点相同，但倒退，它是一种更懒惰的方式。您开始针对现代浏览器构建您的站点，然后应用“补丁”和“修复”，直到它在旧浏览器上可以接受。这最终会产生比从一开始就正确计划更多的工作，并且这种方法通常会发生的情况是开发人员/利益相关者会在某个时候放弃（即，到底是什么？它需要做太多的工作才能做到这一点在 IE6/7 中工作 - 我将取消它们的范围）
2。标准化布局的最佳方式
就个人而言，我的建议是，如果您想要一个跨移动设备和桌面设备的标准布局，我建议您结合使用 BIG 字体（以便它们在移动的小屏幕上可见）和小字体（以便拥有桌面设备的人浏览器可以读取所有详细信息）在桌面尺寸 900-1000 像素宽度上。
这个网站是一个例子：
http://www.valuetrader.net
当我在桌面浏览器中打开它时，我会看到很多细节，但是当我在旅途中使用智能手机时，所有关键信息（即我应该买入还是卖出股票？）都显示在一个非常在我的小屏幕上清晰可辨的大字体。
2014 年更新
这部分问题现在已经有效地变为'实现布局的最佳方式是什么？'。
目前（以及最近几年广泛使用的 CSS3 支持）跨设备布局设计的标准方法是使用基于 media queries 的所谓“响应式”布局.有许多 CSS frameworks 可让用户开始使用适合移动设备的布局。
“响应式”设计的基本原则是，在移动设备上滚动使垂直空间几乎无限，因此您只受水平空间的限制。因此，您必须确保随着屏幕变小，您让页面流动以填满所有可用的水平空间，并且任何导航栏或水平元素都垂直折叠，以便项目彼此堆叠而不是使用空间水平。
测试网站“响应能力”的标准方法是拖动浏览器窗口的一侧以减小可用宽度。
更好的方法是使用开发者工具，例如 Chrome 有一个切换设备模式的按钮，这里是使用 Stackoverflow 的示例：
为桌面和移动屏幕上的#site-banner 元素指定布局的媒体查询示例如下：
/* DESKTOP SUPPORT */
#site-banner { width: 1000px; background: #fff; margin: 0px auto; height: 120px; }
/* TABLET SUPPORT - rules apply below 1000px width */
@media all and (max-width: 1000px) {
#site-banner { width: 700px; }
}
/* PHABLET & MOBILE SUPPORT - rules apply below 700px width */
@media all and (max-width: 700px) {
#site-banner { width: 480px; height: auto; }
}
/* MOBILE SUPPORT - rules apply below 480px width */
@media all and (max-width: 480px) {
#site-banner { width: auto; height: auto;}
}
3.动态图像缩放是如何完成的？
移动设备为您做了很多这样的事情，所以通常您只需要了解它的工作原理。基本上，当第一个移动浏览器问世时，他们必须确保已经为桌面浏览器工作的网站也能在移动设备上运行（否则没有人会使用他们的智能手机浏览网页），所以他们必须想出检测站点宽度并将其调整为可用的屏幕分辨率的巧妙方法。
例如，我的网站“www.desalasworks.com”被编码为 900 像素宽度，但通过在 320 像素的小屏幕上缩小它可以正常工作（页面上的图像使用多种方法自动为resampled - 例如nearest-neighbour sampling 和 bicubic interpolation，并尽可能将字体替换为原生字体）。就图像采样而言，如果您曾经在智能手机上捏过一张照片以“放大”和“缩小”，那么您就会知道我在说什么。
你通常不需要担心 CSS 来让你的图像正确地重新采样，我注意到有时它们在使用百分比宽度时有点有趣，所以如果是这样的话，请坚持使用像素，以便浏览器更容易地告诉哪里物品是相互关联的。请注意，您可以专门检测移动浏览器并将站点的宽度设置为 320 像素，并将其中的所有内容相应地对齐，但实际上这并不是必须在移动设备上拥有一个工作站点，这样做会迫使您维护 2 个站点，一个移动站点和一个桌面站点（一些公司乐于这样做）。
4.百分比/固定宽度。
我个人倾向于使用以屏幕为中心的固定宽度（使用 CSS 边距：0px 自动），我已经很久没有使用百分比宽度了，主要是因为标准化布局有点像噩梦。如果你确实使用百分比宽度，你基本上必须做更多的测试，所以我倾向于远离它们。
请记住，这只是我的观点，一些“响应式网络”专家会以百分比宽度发誓几乎所有内容，我只是不赞成牺牲布局的可预测性来换取我认为的边际收益.但是，我来自构建桌面网络应用程序的背景，如果我只专注于移动网络（水平空间非常宝贵，布局往往更简单），我可能会有不同的想法。