《(39)--Web3-7-网页的色彩与风格.ppt》由会员分享，可在线阅读，更多相关《(39)--Web3-7-网页的色彩与风格.ppt（33页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、WebWeb设计与应用设计与应用3.7 网页的色彩与风格渲染的艺术CSSWEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲其中：R表示红色成分，G表示绿色成分，B表示蓝色成分R、G、B取值分别为0-F三种颜色成分按强度叠加即可产生各种颜色WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲其中：其中：RRRR表示红色成分，表示红色成分，GGGG表示绿色成分，表示绿色成分，BBBB表示蓝色成分表示蓝色成分 RRRR、GGGG、BBBB取值分别为取值分别为00-FF00-FF 三种颜色成分按强度叠加即可产生各种颜色三种颜色成分按强
2、度叠加即可产生各种颜色WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲立方色连续色调WEB设计学习三步曲设计学习三步曲Windows系统Mac系统WEB设计学习三步曲设计学习三步曲灰度等级WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲数值介于十进制0-255WEB设计学习三步曲设计学习三步曲六位十六进制示例RGB颜色示例WEB设计学习三步曲设计学习三步曲 RGBARGBA颜色方式是颜色方式是RGBRGB颜色方式的一个扩展，增加了一个颜色方式的一个扩展，增加了一个AlphaAlpha通道
3、，用来表示颜色的不透明度。通道，用来表示颜色的不透明度。取值介于取值介于0.00.0（完全透明）（完全透明）-1.0-1.0（完全不透明）。（完全不透明）。WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲 HH是是HueHue，意思是，意思是色调色调；S S是是SaturationSaturation，意思是，意思是饱和度饱和度；L L是是LightnessLightness，意思是，意思是亮度亮度。HSL所对应的就是色调、饱和度、亮度的颜色模式色调、饱和度、亮度的颜色模式。这种颜色模式也是比较常用的，Illustrator、PhotoShop、Flash等图形图像还有动画
4、处理软件上都有这种颜色模式的应用。WEB设计学习三步曲设计学习三步曲 取值介于取值介于0-3600-360WEB设计学习三步曲设计学习三步曲 取值介于取值介于0%-100%0%-100%100%0%WEB设计学习三步曲设计学习三步曲 取值介于取值介于0%-100%0%-100%100%0%取值50%，是颜色的本质色WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲 色调的数值如果超出色调的数值如果超出360360，则会按照度数方式进行转换，则会按照度数方式进行转换，即即720720等同于等同于360360，也等同于，也等同于0 0 饱和度和亮
5、度的数值必须是百分比值，因此百分号不能缺饱和度和亮度的数值必须是百分比值，因此百分号不能缺失，否则设置颜色失，否则设置颜色无效无效WEB设计学习三步曲设计学习三步曲 HSLAHSLA颜色颜色方式方式是是HSLHSL颜色颜色方式的一个扩展，增加了一个方式的一个扩展，增加了一个AlphaAlpha通道，用来表示颜色的不透明度。通道，用来表示颜色的不透明度。取值介于取值介于0.00.0（完全透明）（完全透明）-1.0-1.0（完全不透明）。（完全不透明）。WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲17 种标准色是 aqua,black,blue,fuchsia,gray,g
6、reen,lime,maroon,navy,olive,orange,purple,red,silver,teal,white,yellow。WEB设计学习三步曲设计学习三步曲颜色名（十六进制）颜色名（十六进制）颜色名（十六进制）颜色名（十六进制）颜色名（十六进制）颜色名（十六进制）aqua（#00FFFF）black（#000000）blue（#0000FF）fuchsia（#FF00FF）gray（#808080）green（#008000）lime（#00FF00）maroon（#800000）navy（#000080）olive（#808000）orange（#FFA500）purple（#800080）red（#FF0000）silver（#C0C0C0）teal（#008080）white（#FFFFFF）yellow（#FFFF00）WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲WEB设计学习三步曲设计学习三步曲