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

HTML/XHTML教程
CSS 循序渐进(四)表里春秋
精通 CSS 滤镜(五)
让css使网页图片半透明
实现页面图片阴影特效
发现CSS控件的好处
用CSS缩写给你的网站加速
CSS在IE和Nascape的显示差别
利用CSS,不通过replace替换标引HTML标记
拒绝单调 让网页超链接拥有多姿多彩的下划线
对CSS类及id的规范化命名
利用css里expression来实现界面对象的批量控制
利用CSS控制打印
第一章 CSS的基本认识
第二章 CSS的应用方式
第三章 CSS的应用补充
第四章 颜色背景的CSS
第五章 文字性质的CSS
第六章 区块性质的CSS
HTML之其他标记
HTML之链接标记

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 112 ::
收藏到网摘: 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,确定,输入几个字符看看效果,是不是要好一点呢?作者原创,千万不可随意
外传呦^_^。