假设我有1000 px宽2列布局,100 px天沟空间(边距)和左右50px ..如何将黄金比例应用于此布局?
方法一
c1+c2=800px;
c1/c2=1.618;
=>c1= 495px and c2= 305px
50px, column 1 (495px), 100px, column 2 (305px), 50px
Run Code Online (Sandbox Code Playgroud)
方法二计算列宽忽略边距.
c1+c2=1000px
c1/c2=1.618
=>c1= 618px c2=392px
Run Code Online (Sandbox Code Playgroud)
添加边距/填充后的有效列宽
c1=618px -100px = 518px
c2=392px -100px = 292px
50px, column 1 (51), 100px, column 2 (305px), 50px
% difference in two methods 518-495/518= 4%
Run Code Online (Sandbox Code Playgroud)
4%的差异不会产生任何差异,但在处理狭窄的布局时,%差异会更大.
如果您看到这篇文章, 请访问http://www.smashingmagazine.com/2010/02/09/applying-mathematics-to-web-design/
在第一个例子中,他们从黄金比例中取出填充,而在另一个例子中,他们制作了GR的填充部分.
有人可以建议哪种方法更好.
我正在为可自定义的wordpress主题开发这个布局,我提供了一个选择流体布局的选项.我不能使用黄金比例的第一种方法(Can I ??).
我可以使用方法2而不会失去GR为设计带来的和谐.
请包括链接和ref支持您的答案.
PS:我之前在平面设计部分发过这个问题,我建议在这里发布.我希望我没有违反任何规则.
我可以向您推荐这篇关于黄金比例的精彩文章:
http://www.alistapart.com/articles/more-meaningful-typography/
它还包含一个有用工具的链接,用于根据黄金比例和其他几个比例计算数字。为了方便起见,这里是链接: