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) 在白色中混入少量的紫，可誘導人聯想到淡淡的芳香。