ħ！
我了解到，在编写GUI时，特别是如果要在不同的操作系统上使用此GUI，则不应对程序窗口内的任何图形元素使用固定位置。这个原则通常在初级编程课程中讲授，因为GUI在每个不同的操作系统上显示略有不同，并且强制元素的固定坐标可能会对某些机器产生令人尴尬的后果。在没有固定坐标的情况下创建一个外观漂亮的GUI是没有问题的，因为在每个面向对象的API中都有布局对象（如Java中的GridLayout或BorderLayout）。我目前在网页上工作，我很惊讶地发现在互联网上可以阅读的关于css和html的内容恰恰相反！
我正在尝试创建一个类似于这样的布局：http://www.dynamicdrive.com/style/layouts/item/css-fixed-layout-21-fixed-fixed/但是，这个以及css中的许多其他方法都使用固定坐标或绝对坐标。是否可以在不指定分区或“面板”的确切位置的情况下重做此布局？是否有任何方法可以将这些子面板添加到主容器中，并让它们在添加后的命令后自动按照给定的模式排列自己？
使用绝对/固定坐标真的是个好主意吗？创建我发布的布局的最佳方法是什么？
提前致谢！
答案 0 :(得分：1)
不是创建适用于所有浏览器，操作系统，设备和屏幕尺寸的所有用户的 One True Design ，而是遵循Responsive Web Design的原则更好用相同的HTML和CSS实现几种不同的布局。
Here's 41 great examples of responsive web design我建议你看一下。在任何支持Web浏览器的CSS3中打开示例，并调整其大小以查看页面的响应方式。
答案 1 :(得分：1)
网络行业对于布局的“流动性”有不同的意见和做法，显然你使用的布局类型也取决于你的内容和个人品味。您所描述的通常被称为“流动”或“液体”布局，当然是常见做法之一，尤其是现在有更多人使用各种屏幕尺寸浏览网页。
正如@asbjoournu所提到的，现在这已经扩展到“响应式”网页设计的领域，你可以完全改变你的布局，比如说，如果你的网站是在手机上查看的，那么它与大桌面上的布局相比屏幕。
几乎可以肯定可以获得你想要的布局，但我会先阅读流畅和响应式的网页设计，这样你就可以了解需求和可能存在的问题（许多有用的现代技术可以提供不同的响应式布局。例如，支持，特别是在旧版本的Internet Explorer中。）
Here, for example, I've created a layout similar to the one you linked to，而不是固定尺寸，内容作为一个整体调整到窗口的宽度。主要内容始终是总宽度的80％，而不是固定大小。我还添加了一批小“面板”，如您所述，它将根据主要内容div的宽度重新排列，填充尽可能多的宽度。
Layout Gala对您来说可能是一个有趣的资源。它是以四种不同方式设计的单一常见标记，展示了如何使用相同的源文档在纯CSS中实现各种固定和流畅的布局，而不是距离您提供的示例一百万英里。
答案 2 :(得分：1)
对于您链接的特定布局，创建非常简单，无需设置绝对或固定位置，这些位置可在大多数主流浏览器中正常工作和显示。 This example here I made in jsFiddle是一个非常简单的固定布局，使用float但也给出了设置宽度。
你有一个包装器，它可以保存你的所有内容，并通过将左右边距设置为auto来集中放置在窗口中。
你的标题填满了包装的整个宽度。
左边和右边的两个col，两个都设置为向左浮动，下面有一个明确的修复，所以后面的任何内容都没有尝试沿着它浮动。
您的页脚以与标题相同的方式显示。
这可以作为布局使用，但是，与asbjornu链接的示例一样，一旦开始调整浏览器的大小，由于包装器的宽度为800px，一旦您的浏览器低于此值，它将不会调整为更少因为它是固定的。因此，内容将可以滚动到用户。对我而言，这不是一个大问题，因为我知道大多数人不会使用小窗口浏览器查看我的网站，如果他们那么他们很可能习惯于滚动，因为很多网站都是这样制作的，并且大多数智能手机/平板电脑都会自动调整大小并使用缩放功能无论如何都能正常显示，因此很多时候它并不是一个大问题。
但有时候需要采用响应/流畅的设计，而只是知道何时何地使用它。
答案 3 :(得分：1)
我看一下css网格系统 - http://960.gs/是最知名的网格系统之一，如果你是css的新手，那么你就可以使用它们了解如何使用它们
但是http://www.tinyfluidgrid.com/是我最喜欢流畅的