我想知道您对 css 编码、何时/为什么编码固定或流动样式表有什么看法?
我同意固定大小的样式表更容易/更快地编写代码,因为液体需要更多时间才能使所有元素很好地适应它们的父元素。
那么,你什么时候选择液体而不是固定(反之亦然)?为什么?
我想知道您对 css 编码、何时/为什么编码固定或流动样式表有什么看法?
我同意固定大小的样式表更容易/更快地编写代码,因为液体需要更多时间才能使所有元素很好地适应它们的父元素。
那么,你什么时候选择液体而不是固定(反之亦然)?为什么?
更新 2我认为现在的最佳做法是为任何屏幕尺寸设计一个具有响应和自适应功能的网站。Liquid CSS 可能没有您认为的缺陷,例如长文本行(而不是动态调整文本块的位置) - 响应式设计示例 - 页面适应任何屏幕尺寸的浏览器端代码:
自适应设计:托管站点的服务器检测请求页面的浏览器类型并提供适当的页面布局,例如移动。这存在缺陷,因为用户代理标识符并不总是精确的 - 例如,许多浏览器在其 id 中包含 mozilla 字符串,因此依赖这些数据可能并不总是最好的。
上一个答案
流动布局(水平收缩或拉伸以适应窗口的水平宽度的布局)
优点:动态重新格式化内容以充分利用窗口宽度。这意味着选择最流行的固定宽度(例如 940px、960px 或 978px)的困境是不必要的。这对于略有不同的小屏幕手持设备特别有用。在考虑所有可能的屏幕尺寸时,您需要做的工作更少。
缺点:由于站点会收缩或拉伸以适应水平方向,因此您无法像固定宽度那样控制布局。美学和网站的美观程度将不受您的控制。你可能会发现我关于必须做更少的工作来支持所有屏幕宽度的观点毕竟不是真的 - 因为在这里你正在考虑屏幕非常小并且你的菜单导航都聚集在一起并且丑陋或相距太远的场景大屏幕
固定布局(固定布局且不会更改以适应可用的水平宽度)。
优点:一旦您确定了最流行的宽度,例如 940 像素、960 像素等,您就不需要在不同的屏幕宽度下测试网站。布局整洁,东西不动,美学,东西看起来有多漂亮保持不变
缺点:如果您的固定宽度较大,一些屏幕较小的用户,手持设备可能需要水平滚动才能查看您的站点。除非您也支持这些用户可以使用的移动版本
看看主要网站 - 他们在使用什么。对我来说,固定宽度似乎更受欢迎,包括 stackoverflow.com
也就是说,看看这个流畅的网站:http ://derekallard.com/
在这里,开发人员通过使用在窗口中调整站点宽度时相互滑动的图形层来使用流体布局。
更新:没有错误或正确的答案。两者都有优点。从电视、电影和报纸进入网络的媒体人可能倾向于喜欢固定宽度,因为他们熟悉那些具有固定宽度的媒体。
这不是技术问题,而是决策问题。如果您(或客户)想要液体,则选择液体。
我自己不想要液体。为什么?使用非常宽的窗口,您会得到非常长的复制文本行,难以阅读。
好的,还有一些其他部分您必须考虑。您的页面是否可以访问?然后,您必须为缩放页面的布局制作一种流动布局。
您还可以寻找响应式网页设计。也可以在移动浏览器中使用。
http://www.alistapart.com/articles/responsive-web-design/
当有选择的余地时,我很少在除了商业风格的 Web 应用程序之外的任何东西中使用流式布局。
即对于客户坚持在例如表格中提供大量水平信息的应用程序,出于显而易见的原因,我将采用流动布局。对于更标准的网站,如果可能的话,我会坚持使用固定的。
当我为后者选择流动性时,我仍然会在复制文本上强制执行最大宽度,因为我在政治上并不是特别正确,让 99% 的访问者阅读该网站的乐趣对我来说更重要而不是让它(相对)轻而易举地为少数人使用——只要我让那些少数人可以使用它。正如云岑所说,文案的行长对设计和可读性都非常重要。不要让那些线条延伸到无穷大......
大多数情况下,我的固定布局站点将有不同的方式来适应较小的屏幕尺寸,而不仅仅是简单的液体拉伸——在文本下方移动侧边栏等,并可能调整复制文本的宽度以适应设备视口。有时,但并非总是如此,这需要 CSS 媒体查询。
通常固定的布局更容易设计和开发,访问者也习惯了这种布局。
流畅的布局需要更多的规划,也不适合所有类型的 Web 应用程序。我不经常使用流体方法。