当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > 网页配色之黄金分割法

HTML/XHTML教程
XHTML中不再使用HTML中的一些废弃元素
语义化的HTML结构怎么理解
Web 标准学习 理解结构和表现相分离
html5 标签
HTML5 新事件 小结
HTML5 b和i标记将被赋予真正的语义
HTML是网页制作者必须要学习掌握的
HTML DOCTYPE的缩写
Readonly和Disabled的区别
16进制颜色代码(完全)
H标记要在网页制作中合理使用
abbr标记和acronym标记
知名浏览器对DOCTYPE模式的选择机制
用标准dl,dt,dd标签抛弃table列表
html 标签ID可以是变量
iframe 自适应大小实现代码
HTML5 解析规则分析
HTML减肥 精简HTML标记制作网页
HTML5 File API改善网页上传功能
HTML 5 Reset Stylesheet

HTML/XHTML教程 中的 网页配色之黄金分割法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 97 ::
收藏到网摘: n/a

众所周知,数学上有一个黄金分割点--0.618。据说用次比例数分割是最具美感的,
从美眉身材到高楼建筑,从艺术到绘画无不出其之左,因此被称为"神奇的"黄金分割点
。与此同时,人们也对其进行了大量的研究,研究结果更是大量的"神奇"说法。不过,
我辈是现实主义者,"神奇"就不谈了,还是看看咋用它的"神奇"解决我的问题吧--网页
配色之黄金分割法。

  诸位制作过烘培鸡(Homepage)的大虾们都知道,制作网页时网页背景与前景的字
体配色比较麻烦的。如果背景颜色与字体颜色的搭配不合理,就会使网页效果大打折扣
。如果背景色与字体色的对比度太大,就会显得太刺眼;如果对比度太小,就会使网页
风格变得过于沉闷。要达最佳配色实在是麻烦之至,自定义-〉观看效果-〉不合适-〉从
头来……,

  到最后发现我们大部分宝贵的Time都花在了上面。不过别急,有了我的"网页配色之
黄金分割法"之后,就可以大大节省你的时间了。别打!别打!我马上就进入正题了(呜
……呜……)。

  黄金分割法的基本原理是这样的:把颜色的对比度(背景与前景)调节在0.618比例
附近的位置上。下面我以FrontPage 2000为例来讲解一下具体操作。

  1.选择背景色(记住颜色的亮度值)。打开FrontPage 2000以后单击鼠标右键,选
择"网页属性",弹出"网页属性"对话框后选择"背景"单元(或"格式"菜单下的"背景"选
项),然后在背景色选项中选取你想要的任意背景色,然后确定(本例中选取橄榄绿RG
B:0,128,0 亮度:60)。

  2.选择前景色。选择格式-〉字体,在字体颜色中选取"其他颜色"。弹出颜色对话
框后选择"自定义",弹出Windows的标准颜色对话框(如图):
    

  3.计算亮度值。若背景色的亮度值为0-92时,将上述对话框中的亮度确定为X+148
;若在148-240之间则定为X-148。然后选择任何你认为搭配合理的颜色(亮度值不变)
作为前景色。选择原理如下:亮度的最大值是240,黄金分割值为240×0.618≈148,即
亮度差为148为最佳对比度,因此选取的前景色与背景色亮度值至少有一位于0-92或148
-240之间,其他亮度值不一选取(强烈建议)。

  Ok,确定,输入几个字符看看效果,是不是要好一点呢?作者原创,千万不可随意
外传呦^_^。