A. web前端鼠标经过图片凸起底下有影印怎样做
用css就可以制作出来这种效果。
当鼠标移入的时候用:hover ,给图片一个相对定位，例如偏移top:2px ;left:2px;，然后给右边和下面加阴影，这样就做出了图片凸起的效果了
B. Html/CSS前端如何实现文字边框阴影
《CSS3文本阴影 text-shadow》
结构代码：
<divclass="h5course">欢迎沟通交流~HTML5学堂</div>
样式代码：
html{
background:#000;
}
.h5course{
width:400px;
height:200px;
text-shadow:1px1px0#f96,
-1px-1px0#f96;
background:#ccc;
line-height:200px;
text-align:center;
font-size:30px;
font-family:"微软雅黑";
}
C. HTML字体要怎么加粗
在word里面实现文字加粗是一件轻而易举的事。我们直接点击加粗按钮就可以完成。但是在css里面没有加粗按钮呀，那么如何实现字体加粗呢？下面小编向大家简单介绍一下。
1.使用font-weight属性
一说到在CSS里实现加粗，大家第一反应是不是使用font-weight属性。没错，这是在CSS实现加粗的方法之一。
font-weight属性的值可以是： normal 、 bold、 bolder 、 lighter 、 number。
normal: 正常的字体，相当于number为400，声明此值将取消之前任何设置
bold: 粗体，相当于number为700，也相当于html b 加粗对象的作用
bolder: IE5+特粗体
lighter: IE5+细体
number: IE5+100|200|300|400|500|600|700|800|900
这个属性我们最常用的值是bold，当然你也可以实际需要调整number数值达到自己所需的效果。
实例:
效果:
看到这个效果,你是否有这样一个疑问:怎么数值900和bold的效果差不多呀?bold不是相当于数值700吗?这是因为加粗作用是由用户端系统安装的字体的特定字体变量映射决定。系统选择最近的匹配。也就是说，用户可能看不到不同值之间的差异。
因为web前端开发在国内的火爆，所以很多人都开始自学web前端开发。但是如果一个人自学是很有难度的，可能花费了大量的时间和精力还未必可以收到效果。给你推荐一个裙，前端开发的前面是四 四五，前端开发的中间是IO 7，前端开发的后面是四 八 六。这里每天都有免费的课程可以学习，还有很多人和你一起进步，如果你是想学习的就赶紧加入，不想学习的就不要加咯.
2.html常规加粗标签
除了font-weight属性之外，我们还有方法对字体实施加粗吗？
我们先看看下面的代码:
运行:
嘿嘿!由上图我们可以看到运行效果跟font-weight属性差不多喔！因此我们可以得出：使用html标签<b></b>或<strong></strong>也能达到加粗的效果。
以上就是小编所知道的在CSS里面实现字体加粗的两种方法，两种方法都非常简单。学会以后，大家在日后的网页设置中就不愁如何加粗字体了。当然如果你还有其他实现字体加粗的方法，记得告诉小编，大家共同学习喔！
D. 前端中给div添加阴影，但是div默认有内边距导致内边距也会有阴影的颜色怎么处理
可以使用伪类:before,让他的content为空，原元素相对定位，伪类绝对定位宽高百分百加阴影，影响层级的话可以用z-index调整
E. html怎么改变字体大小和颜色
可以用css改变字体的大小和颜色。
1、新建html文件，在body标签中添加文字，这里以p标签内容为“演示文本”为例，这时网页将会显示字体默认大小和颜色：
F. web前端必备英语词汇都在这儿了，客官你了解多少
appendChild 放置到某元素最后
attribute 属性
addEventListener 添加侦听器
assign 赋值
alert 弹出框
append 添加
appendTo 添加到
absolute 绝对的
active 活动的，激活的，标记的一个伪类
align 对齐
alpha 透明度，半透明anchor 锚记标记是这个单词的缩写
anchor 锚记<a>标记是这个单词的缩写
arrow 箭头
auto 自动
appName 程序名
appCodeName 程序代号
appVersion 程序版本
appAgent 程序代理
abs 取绝对值
array 数组
back 超过范围的三次方缓动
bounce 指数衰减的反弹缓动
before 在...之前
blur 当输入框失焦的时候触发
BOM 全称Browser Object Model 浏览器对象模型
blur 失焦
bind 绑定
background 背景border 边框
border 边框
banner 页面上的一个横条both 二者都是clear 属性的一个属性值
both 二者都是clear 属性的一个属性值
black 黑色
bottom 底部，是一个CSS 属性
blink 闪烁
box 盒子
block 块
br 换行标记
blue 蓝色
bug 软件程序中的错误
body 主体，一个HTML 标记
building 建立
bold 粗体
button 按钮
break 中断
bool 布尔
boolean 布尔
bubble 冒泡
cubic 三次方的缓动
circular 圆形曲线的缓动
chain 当执行一种缓动效果后可以继续使用另一个缓动效果
createElement 创建新元素
createTextNode 创建文本节点
childNodes 返回子节点
cancelBubble 删除冒泡
click 点击事件
change 内容发生改变，并失焦后才触发该事件
contextmenu 右击事件
clientX 光标相对于该网页的水平位置
clientY 光标相对于该网页的垂直位置
close 关闭当前页面
confirm 输入框
clientWidth 获取元素宽度
clientHeight 获取元素的高度
childNodes� 获取所有子节点�
children 返回子元素
cloneNode 复制节点
Clone 克隆、复制
chekbox 复选框
cell 表格的单元格
color 颜色
center 中间，居中
connected 连接的
contact 联系
child 孩子
content 内容
circle 圆圈
crosshair 十字叉丝
class 类别
css 层叠样式表
clear 清除
cursor 鼠标指针
cm 厘米
centimeter 厘米
continue 继续
close 关闭
ceil 向上取整
charAt 获取某位置字符
DOM 全称Document Object Model 文档对象模型
default 不执行
DOMMouseScroll 在火狐浏览器中的滚轮事件
document 文件，文档
dbclick 双击
dashed 虚线
display 显示，CSS 的一个属
decimal 十进制
division 分区，div 就是这个单词的缩写
decoration 装饰
document 文档
default 默认的
definition 定义
dotted 点线
double 双线
design 设计
do 做
exponential 指数曲线的缓动
elastic 指数衰减的正弦曲线缓动
error 错误 过失
element 元素
else 否则
focus 当输入框聚焦的时候触发
firstChild 第一个子节点
firstElementChild 返回第一个标签节点
function() 函数
father 父亲
float 浮动
filter 滤镜，过滤器
font 字体
first 第一个
for 在循环语句中的一个保留字
fixed 固定的
four 4 个
function函数，功能
getAttribute 获取属性
getElementsByClassName 根据class标签获取元素
getElementsByName� 通过元素的Name属性值
getElementById� 通过元素Id，唯一性
getElementsByTagName 通过标签名查找元素
gif 一种图像格式
green 绿色
gray 灰色
history 对象
host 主机
height 高度
hover 盘旋;徘徊;犹豫
hidden() 隐藏
hack 常用于CSS 中的一些招数，或者类似于偏方的技巧
here 这里
hand 手
hidden 被隐藏
head 头部
home 首页
height 高度
horizontal 水平的
help 帮助
hover 鼠标指针经过时的效果，或称为“悬停状态”
input 当输入的时候实时触发
innerHeight 内部高度
innerWidth 内部宽度
in 从0开始加速的缓动
inOut 前半段从0开始加速，后半段减速到0的缓动
infinity 无线循环
insertBefore 插入到某元素前
image 图像
inline 行内
important 重要的
inner 内部的
indent 缩进
italic 意大利体，斜体
index 索引
if如果
int：整数
indexOf：判断某字符的首次位置
jpg 一种图像格式justify 两端对齐
justify 两端对齐
keyCode 按键编码
keydown 按下按键
keyup 按下按键抬起
linear 匀速
lastChild� 返回最后一个子节点
lastElementChild� 返回最后一个标签节点�
language 语言
line 线
last 最后一个
link 链接
left 左边
list 列表
length 长度
lowercase 小写
level 级别
mouseover 移动到元素上
mouseout 从元素上移开
mousemove 移动鼠标
mousewheel 在其他浏览器的滚轮事件
mousedown 鼠标按下事件
mouseup 鼠标抬起事件
margin 外边距
millimeter 毫米
max 最大的
min 最小的
medium 中间
model 模型
menu 菜单
move 移动
middle 中间
nextElementSibling 返回下一个兄弟元素
nextSibling 返回下一个兄弟节点
nextElementSibling� 下一个兄弟元素
nodeValue 节点值
nodeType 节点类型
nodeName 标签名称
navigation 导航
none 无，不，没有
new 新的
normal 标准
number 数字
null 空，空值
new 新建
outerHeight 整个高度
outerWIdth 整个宽度
open 打开新页面
onscroll 窗口滚动事件
onresize 窗口大小监听事件
onload 图片加载事件
offsetLeft 获取元素距离左侧的距离�
offsetTop 获取元素距离顶部的距离
offsetWidth 获取元素自身宽度
offsetHeigh 获取元素自身高度�
onload 在装载时
onclick 在点击时
ondblclick 在双击时
onmouseover 在鼠标进入时
onmouseout 在鼠标离开时
onmousemove 在鼠标移动时
onmousedown 在鼠标按下时
onmouseup 在鼠标抬起时
onkeydown 在按键按下时
onkeyup在按键抬起时
onkeypress 在按键时
onsubmit 在提交时
onchange 在改变时
onfocus 在获得焦点时
onblur 在失去焦点时
onscroll 窗口滚动事件
onresize 窗口大小监听事件
out 减速到0的缓动
onStart 开始事件
onComplete 完成事件
onStop 停止事件
onUpdate 更新事件
object 对象
optional 可选的
oblique 一种斜体
orange 橙色
one 一个
outer 外面的
only 仅仅
overflow 溢出
open 打开
previous 前一个
prevent 阻止
pageX 光标相对于该网页的水平位置
pageY 光标相对于该网页的垂直位置
port 端口
protocol 协议
prompt 提示框
parentNode 返回父级节点
parentElementNode 获取已知节点的父节点
previousSibling 返回上一个兄弟节点
previousElementSibling 返回上一个兄弟元素
password 密码
position 位置
prepend 预先
padding 内边距
progress 进度
point 点
public 公开的
pointer 指针，指示器
purple 紫色
position 定位，位置
pop 弹出
push 压入
open 打开
option 选项
quadratic 二次方的缓动
quintic 五次方的缓动
quartic 四次方的缓动
querySelector 根据标签名获取第一个元素
querySelectorAll 获取所有标签名的元素
repeat 次数
remove 删除当前节点
replaceChild 替换节点
removeEventListener 取消侦听器
reload 刷新
removeAttribute 删除属性
removeChild 删除父节点的某个子节点
radio 视频
red 红色
resize 重新设置大小
relative 相对的
right 右边
repeat 重复，平铺
row 行
replacement替换
return 返回
random 随机
round 取整
sinusoidal 正弦曲线的缓动
start 开始
stop 停止
setinterval 时间函数
sibling 兄弟
scrollTop 获取文档滚动高度
screenX 光标相对于该屏幕的水平位置
screenY 光标相对于该屏幕的垂直位置
setAttribute 设置属性
scrollHeight 获取文档整体高度
scrollTop 获取文档滚动高度
scrollLeft 元素左边界
setAttribute 设置节点上的属性
submit 提交
scroll 滚动
shadow 阴影
silver 银色
special 特殊的
size 尺寸
square 方块
solid 固体，实线
static 静态的
solution 方案
strong 强壮，加粗的
son 儿子
style 样式
span 一个HTML 标记
switch 切换
setInterval 设置反复性定时器
setTimeout 设置一次性定时器
srcElement 源对象，事件源
split 分割
substr 截取字符串
substring 截取字符串
sqrt 取开方
status 状态
sort 排序
slice 切片，划分
splice 铰接，粘接
textContent 文本添加文字
table 表格
title 标题
td 单元格的HTML 标记
top 顶部
toLowerCase 转换为小写
toUpperCase 转换为大写
text 文本
tr 表格中“行”的HTML 标记
thick 粗的
transitional 过渡的
thin 细的
two 两个
three 三个
type 类型
through 穿过
this 这个，当前
typeof 类型
underline 下划线
uppercase 大写
upper 上面的
url 网址
vertical 竖直的
visited 访问过的
var 定义变量
wrap 包裹
window 窗口
white 白色
width 宽度
while 当...的时候
write 写入
yellow 黄色
G. web前端网页颜色的搭配技巧
一般来说，网页的背景色应该柔和一些、素一些、淡一些，再配上深色的文字，使人看起来自然、舒畅对于做网页的初学者可能更习惯于使用一些漂亮的图片作为自己网页的背景，但是，浏览一下大型的商业网站，你会发现他们更多运用的是白色、蓝色、黄色等，使得网页显得典雅，大方和温馨。更重要的是，这样可以大大加快浏览者打开网页的速度。
一般来说，网页的背景色应该柔和一些、素一些、淡一些，再配上深色的文字，使人看起来自然、舒畅。而为了追求醒目的视觉效果，可以为标题使用较深的颜 色。下面是我做网页和浏览别人的网页时，对网页背景色和文字色彩搭配积累的经验，这些颜色可以做正文的底色，也可以做标题的底色，再搭配不同的字体，一定 会有不错的效果，希望对大家在制作网页时有用。
BgcolorΚ〃#F1FAFA〃———做正文的背景色好，淡雅
BgcolorΚ〃#E8FFE8〃———做标题的背景色较好
BgcolorΚ〃#E8E8FF〃———做正文的背景色较好，文字颜色配黑色
BgcolorΚ〃#8080C0〃———上配黄色白色文字较好
BgcolorΚ〃#E8D098〃———上配浅蓝色或蓝色文字较好
BgcolorΚ〃#EFEFDA〃———上配浅蓝色或红色文字较好
BgcolorΚ〃#F2F1D7〃———配黑色文字素雅，如果是红色则显得醒目
BgcolorΚ〃#336699〃———配白色文字好看些
BgcolorΚ〃#6699CC〃———配白色文字好看些，可以做标题
BgcolorΚ〃#66CCCC〃———配白色文字好看些，可以做标题
BgcolorΚ〃#B45B3E〃———配白色文字好看些，可以做标题
BgcolorΚ〃#479AC7〃———配白色文字好看些，可以做标题
BgcolorΚ〃#00B271〃———配白色文字好看些，可以做标题
BgcolorΚ〃#FBFBEA〃———配黑色文字比较好看，一般作为正文
BgcolorΚ〃#D5F3F4〃———配黑色文字比较好看，一般作为正文
BgcolorΚ〃#D7FFF0〃———配黑色文字比较好看，一般作为正文
BgcolorΚ〃#F0DAD2〃———配黑色文字比较好看，一般作为正文
BgcolorΚ〃#DDF3FF〃———配黑色文字比较好看，一般作为正文
浅绿色底配黑色文字，或白色底配蓝色文字都很醒目，但前者突出背景，后者突出文字。红色底配白色文字，比较深的底色配黄色文字显得非常有效果。
此文只是起一个“抛砖引玉”的作用，大家可以发挥想象力，搭配出更有新意、更醒目的颜色，使网页更具有吸引力
如今，互联网越来越走近我们的生活，网上冲浪也渐渐成为我们生活不可缺少的一部分。网络世界五彩缤纷，涌现出大量优秀精美的网页。大量网络信息的呈 现，无非就是通过文本、图像、Flash动画等，其中， 文本是网页中最为重要的设计元素。对于网页设计初学者而言，了解和掌握网页设计中的文字排版设计就显得尤为重要，下面笔者想谈谈一己之见。
文字的格式化
字号、字体、行距
字号大小可以用不同的方式来计算，例如磅#quotel.quoter#或像素(Pixel)。因为以像素技术为基础单位打印时需要转换为磅，所以，建议采用磅为单位。
最适合于网页正文显示的字体大小为12磅左右，现在很多的综合性站点，由于在一个页面中需要安排的内容较多，通常采用9磅的字号。较大的字体可用于标 题或其他需要强调的地方，小一些的字体可以用于页脚和辅助信息。需要注意的是，小字号容易产生整体感和精致感，但可读性较差。
网页设计者可以用字体来更充分地体现设计中要表达的情感。字体选择是一种感性、直观的行为。但是，无论选择什么字体，都要依据网页的总体设想和浏览者 的需要。例如：粗体字强壮有力，有男性特点，适合机械、建筑业等内容；细体字高雅细致，有女性特点，更适合服装、化妆品、食品等行业的内容。在同一页面 中，字体种类少，版面雅致，有稳定感；字体种类多，则版面活跃，丰富多彩。关键是如何根据页面内容来掌握这个比例关系。
从加强平台无关性的角度来考虑，正文内容最好采用缺省字体。因为浏览器是用本地机器上的字库显示页面内容的。作为网页设计者必须考虑到大多数浏览者的 机器里只装有三种字体类型及一些相应的特定字体。而你指定的字体在浏览者的机器里并不一定能够找到，这给网页设计带来很大的局限。解决问题的办法是：在确 有必要使用特殊字体的地方，可以将文字制成图像，然后插入页面中。
行距的变化也会对文本的可读性产生很大影响。一般情况下，接近字体尺寸的行距设置比较适合正文。行距的常规比例为10:12，即用字10点，则行距 12点。这主要是出于以下考虑：适当的行距会形成一条明显的水平空白带，以引导浏览者的目光，而行距过宽会使一行文字失去较好的延续性。
除了对于可读性的影响，行距本身也是具有很强表现力的设计语言，为了加强版式的装饰效果，可以有意识地加宽或缩窄行距，体现独特的审美意趣。例如，加 宽行距可以体现轻松、舒展的情绪，应用于娱乐性、抒情性的内容恰如其分。另外，通过精心安排，使宽、窄行距并存，可增强版面的空间层次与弹性，表现出独到 的匠心。
行距可以用行高(line-height)属性来设置，建议以磅或默认行高的百分数为单位。例如：｛line-height：20pt｝、｛line-height：150%｝。
文字的整体编排
页面里的正文部分是由许多单个文字经过编排组成的群体，要充分发挥这个群体形状在版面整体布局中的作用。从艺术的角度可以将字体本身看成是一种艺术形 式，它在个性和情感方面对人们有着很大影响。在网页设计中，字体的处理与颜色、版式、图形等其他设计元素的处理一样非常关键。从某种意义上来讲，所有的设 计元素都可以理解为图形。
1．文字的图形化
字体具有两方面的作用：一是实现字意与语义的功能，二是美学效应。所谓文字的图形化，即是强调它的美学效应，把记号性的文字作为图形元素来表现，同时 又强化了原有的功能。作为网页设计者，既可以按照常规的方式来设置字体，也可以对字体进行艺术化的设计。无论怎样，一切都应围绕如何更出色地实现自己的设 计目标。
将文字图形化、意象化，以更富创意的形式表达出深层的设计思想，能够克服网页的单调与平淡，从而打动人心。
2．文字的叠置
文字与图像之间或文字与文字之间在经过叠置后，能够产生空间感、跳跃感、透明感、杂音感和叙事感，从而成为页面中活跃的、令人注目的元素。虽然叠置手 法影响了文字的可读性，但是能造成页面独特的视觉效果。这种不追求易读，而刻意追求“杂音”的表现手法，体现了一种艺术思潮。因而，它不仅大量运用于传统 的版式设计，在网页设计中也被广泛采用。
3．标题与正文
在进行标题与正文的编排时，可先考虑将正文作双栏、三栏或四栏的编排，再进行标题的置入。将正文分栏，是为了求取页面的空间与弹性，避免通栏的呆板以 及标题插入方式的单一性。标题虽是整段或整篇文章的标题，但不一定千篇一律地置于段首之上。可作居中、横向、竖向或边置等编排处理，甚至可以直接插入字群 中，以新颖的版式来打破旧有的规律。
4．文字编排的四种基本形式
页面里的正文部分是由许多单个文字经过编排组成的群体，要充分发挥这个群体形状在版面整体布局中的作用。
两端均齐：文字从左端到右端的长度均齐，字群形成方方正正的面，显得端正、严谨、美观。
居中排列：在字距相等的情况下，以页面中心为轴线排列，这种编排方式使文字更加突出，产生对称的形式美感。
左对齐或右对齐：左对齐或右对齐使行首或行尾自然形成一条清晰的垂直线，很容易与图形配合。这种编排方式有松有紧，有虚有实，跳动而飘逸，产生节奏与韵律的形式美感。左对齐符合人们阅读时的习惯，显得自然；右对齐因不太符合阅读习惯而较少采用，但显得新颖。
绕图排列：将文字绕图形边缘排列。如果将底图插入文字中，会令人感到融洽、自然。
文字的强调
1．行首的强调
将正文的第一个字或字母放大并作装饰性处理，嵌入段落的开头，这在传统媒体版式设计中称之为“下坠式”。此技巧的发明溯源于欧洲中世纪的文稿抄写员。 由于它有吸引视线、装饰和活跃版面的作用，所以被应用于网页的文字编排中。其下坠幅度应跨越一个完整字行的上下幅度。至于放大多少，则依据所处网页环境而 定。
2．引文的强调
在进行网页文字编排时，常常会碰到提纲挈领性的文字，即引文。引文概括一个段落、一个章节或全文大意，因此在编排上应给予特殊的页面位置和空间来强 调。引文的编排方式多种多样，如将引文嵌入正文的左右侧、上方、下方或中心位置等，并且可以在字体或字号上与正文相区别而产生变化。
3．个别文字的强调
如果将个别文字作为页面的诉求重点，则可以通过加粗、加框、加下划线、加指示性符号、倾斜字体等手段有意识地强化文字的视觉效果，使其在页面整体中显得出众而夺目。另外，改变某些文字的颜色，也可以使这部分文字得到强调。这些方法实际上都是运用了对比的法则。
文字的颜色
在网页设计中，设计者可以为文字、文字链接、已访问链接和当前活动链接选用各种颜色。例如，如果你使用FrontPage编辑器，默认的设置是这样 的：正常字体颜色为黑色，默认的链接颜色为蓝色，鼠标点击之后又变为紫红色。使用不同颜色的文字可以使想要强调的部分更加引人注目，但应该注意的是，对于 文字的颜色，只可少量运用，如果什么都想强调，其实是什么都没有强调。况且，在一个页面上运用过多的颜色，会影响浏览者阅读页面内容，除非你有特殊的设计 目的。
颜色的运用除了能够起到强调整体文字中特殊部分的作用之外，对于整个文案的情感表达也会产生影响。这涉及色彩的情感象征性问题，限于篇幅，在这里不做深入探讨。
另外需要注意的是文字颜色的对比度，它包括明度上的对比、纯度上的对比以及冷暖的对比。这些不仅对文字的可读性发生作用，更重要的是，你可以通过对颜色的运用实现想要的设计效果、设计情感和设计思想。
一、色彩处理
色彩是人的视觉最敏感的东西。主页的色彩处理得好，可以锦上添花，达到事半功倍的效果。色彩总的应用原则应该是“总体协调，局部对比”，也就是：主页的整 体色彩效果应该是和谐的，只有局部的、小范围的地方可以有一些强烈色彩的对比。在色彩的运用上，可以根据主页内容的需要，分别采用不同的主色调。因为色彩 具有象征性，例如：嫩绿色、翠绿色、金黄色、灰褐色就可以分别象征着春、夏、秋、冬。其次还有职业的标志色，例如：军警的橄榄绿，医疗卫生的白色等。色彩 还具有明显的心理感觉，例如冷、暖的感觉，进、退的效果等。另外，色彩还有民族性，各个民族由于环境、文化、传统等因素的影响，对于色彩的喜好也存在着较 大的差异。充分运用色彩的这些特性，可以使我们的主页具有深刻的艺术内涵，从而提升主页的文化品位。下面介绍几种常用的配色方案：
1.暖色调。即红色、橙色、黄色、赭色等色彩的搭配。这种色调的运用，可使主页呈现温馨、和煦、热情的氛围。
2.冷色调。即青色、绿色、紫色等色彩的搭配。这种色调的运用，可使主页呈现宁静、清凉、高雅的氛围。
3.对比色调。即把色性完全相反的色彩搭配在同一个空间里。例如：红与绿、黄与紫、橙与蓝等。这种色彩的搭配，可以产生强烈的视觉效果，给人亮丽、鲜艳、 喜庆的感觉。当然，对比色调如果用得不好，会适得其反，产生俗气、刺眼的不良效果。这就要把握“大调和，小对比”这一个重要原则，即总体的色调应该是统一 和谐的，局部的地方可以有一些小的强烈对比。
最后，还要考虑主页底色（背景色）的深、浅，这里借用摄影中的一个术语，就是“高调”和“低调”。底色浅的称为高调；底色深的称为低调。底色深，文字的颜 色就要浅，以深色的背景衬托浅色的内容（文字或图片）；反之，底色淡的，文字的颜色就要深些，以浅色的背景衬托深色的内容（文字或图片）。这种深浅的变化 在色彩学中称为“明度变化”。有些主页，底色是黑的，但文字也选用了较深的色彩，由于色彩的明度比较接近，读者在阅览时，眼睛就会感觉很吃力，影响了阅读 效果。当然，色彩的明度也不能变化太大，否则屏幕上的亮度反差太强，同样也会使读者的眼睛受不了。
网页色彩的搭配
网页的色彩是树立网站形象的关键之一，色彩搭配却是网友们感到头疼的问题。网页的背景，文字，图标，边框，超链接…，应该采用什么样的色彩，应该搭配什么色彩才能最好的表达出预想的内涵呢？阿捷这里谈一些心得，希望对你有所启发。
首先我们先来了解一些色彩的基本知识：
1.颜色是因为光的折射而产生的。
2.红，黄，蓝是三原色，其它的色彩都可以用这三种色彩调和而成。网页html语言中的色彩表达即是用这三种颜色的数值表示例如：红色是color (255,0,0)十六进制的表示方法为(FF0000)白色为(FFFFFF), 我们经常看到的”bgColor=#FFFFFF”就是指背景色为白色。
3.颜色分非彩色和彩色两类。非彩色是指黑，白，灰系统色。彩色是指除了非彩色以外的所有色彩。
4.任何色彩都有饱和度和透明度的属性，属性的变化产生不同的色相，所以至少可以制作几百万种色彩。
网页制作用彩色还是非彩色好呢？根据专业的研究机构研究表明：彩色的记忆效果是黑白的3.5倍。也就是说，在一般情况下，彩色页面较完全黑白页面更加吸引人。
我们通常的做法是：主要内容文字用非彩色(黑色)，边框，背景，图片用彩色。这样页面整体不单调，看主要内容也不会眼花。
●非彩色的搭配
黑白是最基本和最简单的搭配，白字黑底，黑底白字都非常清晰明了。 灰色是万能色，可以和任何彩色搭配，也可以帮助两种对立的色彩和谐过渡。如果你实在找不出合适的色彩，那么用灰色试试，效果绝对不会太差。
●彩色的搭配
色彩千变万化，彩色的搭配是我们研究的重点。我们依然需要进一步学习一些色彩的知识。
一.色环。我们将色彩按”红->黄->绿->蓝->红”依次过度渐变，就可以得到一个色彩环。色环的两端是暖色和寒色，当中是中型色。(如下图)
红.橙.橙黄.黄.黄绿.绿.青绿.蓝绿.蓝.蓝紫.紫.紫红.红
暖色系 中性系 寒色系 中性系
二.色彩的心理感觉。不同的颜色会给浏览者不同的心理感受。
红色—是一种激奋的色彩。刺激效果，能使人产生冲动，愤怒，热情，活力的感觉。
绿色—介于冷暖两中色彩的中间，显得和睦，宁静，健康，安全的感觉。 它和金黄，淡白搭配，可以产生优雅，舒适的气氛。
橙色—也是一种激奋的色彩，具有轻快，欢欣，热烈，温馨，时尚的效果。
黄色—具有快乐，希望，智慧和轻快的个性，它的明度最高。
蓝色—是最具凉爽，清新，专业的色彩。它和白色混合，能体现柔顺，淡雅，浪漫的气氛(象天空的色彩:)
白色—具有洁白，明快，纯真，清洁的感受。
黑色—具有深沉，神秘，寂静，悲哀，压抑的感受。
灰色—具有中庸，平凡，温和，谦让，中立和高雅的感觉。
每种色彩在饱和度，透明度上略微变化就会产生不同的感觉。以绿色为例，黄绿色有青春，旺盛的视觉意境，而蓝绿色则显得幽宁，阴深。
●网页色彩搭配的原理
1.色彩的鲜明性。网页的色彩要鲜艳，容易引人注目。
2.色彩的独特性。要有与众不同的色彩，使得大家对你的印象强烈。(参考设计思考第二篇网站CI的标准色彩一节)
3.色彩的合适性。就是说色彩和你表达的内容气氛相适合。如用粉色体现女性站点的柔性。
4.色彩的联想性。不同色彩会产生不同的联想，蓝色想到天空，黑色想到黑夜，红色想到喜事等，选择色彩要和你网页的内涵相关联。
●网页色彩掌握的过程
随着网页制作经验的积累，我们用色有这样的一个趋势:单色->五彩缤纷->标准色->单色。一开始因为技术和知识缺乏，只能制作 出简单的网页，色彩单一；在有一定基础和材料后，希望制作一个漂亮的网页，将自己收集的最好的图片，最满意色彩堆砌在页面上；但是时间一长，却发现色彩杂 乱，没有个性和风格；第三次重新定位自己的网站，选择好切合自己的色彩，推出的站点往往比较成功；当最后设计理念和技术达到顶峰时，则又返朴归真，用单一 色彩甚至非彩色就可以设计出简洁精美的站点。
○网页色彩搭配的技巧
文章写到这里，有心急的网友要问了：“到底用什么色彩搭配好看呢？你能不能推荐几种配色方案？”别急，这里有一点技巧，可以帮助你迅速成为调色大师:)
1.用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，(说得通俗些就是将 色彩变淡或则加深)，产生新的色彩，用于网页。这样的页面看起来色彩统一，有层次感。
2.用两种色彩。先选定一种色彩，然后选择它的对比色(在photoshop里按ctrl+shift+I)。我的主页用蓝色和黄色就是这样确定的。整个页面色彩丰富但不花稍。
3.用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。确定色彩的方法各人不同，我是在photoshop里按前景色方框，在跳出的拾色器窗中选择”自定义”，然后在”色库”中选就可以了:)
4.用黑色和一种彩色。比如大红的字体配黑色的边框感觉很”跳”。
在网页配色中，忌讳的是：
1.不要将所有颜色都用到，尽量控制在三种色彩以内。
2.背景和前文的对比尽量要大，(绝对不要用花纹繁复的图案作背景)，以便突出主要文字内容
颜 色 搭 配
一、红色的色感温暖，性格刚烈而外向，是一种对人刺激性很强的色。红色容易引起人的注意，也容易使人兴奋、激动、紧张、冲动、还是一种容易造成人视觉疲劳的色。
a) 在红色中加入少量的黄，会使其热力强盛，趋于躁动、不安。
b) 在红色中加入少量的蓝，会使其热性减弱，趋于文雅、柔和。
c) 在红色中加入少量的黑，会使其性格变的沉稳，趋于厚重、朴实。
d) 在红中加入少量的白，会使其性格变的温柔，趋于含蓄、羞涩、娇嫩。
二、黄色的性格冷漠、高傲、敏感、具有扩张和不安宁的视觉印象。黄色是各种色彩中，最为娇气的一种色。只要在纯黄色中混入少量的其它色，其色相感和色性格均会发生较大程度的变化。
a) 在黄色中加入少量的蓝，会使其转化为一种鲜嫩的绿色。其高傲的性格也随之消失，趋于一种平和、潮润的感觉。
b) 在黄色中加入少量的红，则具有明显的橙色感觉，其性格也会从冷漠、高傲转化为一种有分寸感的热情、温暖。
c) 在黄色中加入少量的黑，其色感和色性变化最大，成为一种具有明显橄榄绿的复色印象。其色性也变的成熟、随和。
d) 在黄色中加入少量的白，其色感变的柔和，其性格中的冷漠、高傲被淡化，趋于含蓄，易于接近。
三、蓝色的色感冷嘲热讽，性格朴实而内向，是一种有助于人头脑冷嘲热讽静的色。蓝色的朴实、内向性格，常为那些性格活跃、具有较强扩张力的色彩，提供一 个深远、广埔、平静的空间，成为衬托活跃色彩的友善而谦虚的朋友。蓝色还是一种在淡化后仍然似能保持较强个性的色。如果在蓝色中分别加入少量的红、黄、 黑、橙、白等色，均不会对蓝色的性格构成较明显的影响力。
a) 如果在橙色中黄的成份较多，其性格趋于甜美、亮丽、芳香。
b) 在橙色中混入小量的白，可使橙色的知觉趋于焦躁、无力。
四、绿色是具有黄色和蓝色两种成份的色。在绿色中，将黄色的扩张感和蓝色的收缩感相中庸，将黄色的温暖感与蓝色的寒冷感相抵消。这样使得绿色的性格最为平和、安稳。是一种柔顺、恬静、潢足、优美的色。
a) 在绿色中黄的成份较多时，其性格就趋于活泼、友善，具有幼稚性。
b) 在绿色中加入少量的黑，其性格就趋于庄重、老练、成熟。
c) 在绿色中加入少量的白，其性格就趋于洁净、清爽、鲜嫩。
五、 紫色的明度在有彩色的色料中是最低的。紫色的低明度给人一种沉闷、神秘的感觉。
a) 在紫色中红的成份较多时，其知觉具有压抑感、威胁感。
b) 在紫色中加入少量的黑，其感觉就趋于沉闷、伤感、恐怖。
c) 在紫色中加入白，可使紫色沉闷的性格消失，变得优雅、娇气，并充满女性的魅力。
六、 白色的色感光明，性格朴实、纯洁、快乐。白色具有圣洁的不容侵犯性。如果在白色中加入其它任何色，都会影响其纯洁性，使其性格变的含蓄。
a) 在白色中混入少量的红，就成为淡淡的粉色，鲜嫩而充满诱惑。
b) 在白色中混入少量的黄，则成为一种乳黄色，给人一种香腻的印象。
c) 在白色中混入少量的蓝，给人感觉清冷、洁净。
d) 在白色中混入少量的橙，有一种干燥的气氛。
e) 在白色中混入少量的绿，给人一种稚嫩、柔和的感觉。
f) 在白色中混入少量的紫，可诱导人联想到淡淡的芳香。