|
網站建設是指使用標識語言（markup language)，通過一系列設計、建模、和執行的過程將電子格式的信息通過互聯網傳輸，最終以圖形用戶界面（GUI）的形式被用戶所瀏覽。簡單來說，網頁設計的目的就是產生網站。簡單的信息如文字，圖片（GIF，JPEG，PNG）和表格，都可以通過使超文件標示語言、可擴展超文本標記語言等標示語言放置到網站頁面上。
如果你能很好地應用CSS，那么你的主頁將被打扮得很靚。下面就給大家介紹用CSS做出的一個鼠標單擊特殊效果圖。
一、將下面的代碼復制到你的主頁中<head>和</head>之間。
<STYLE>.shadow {
FILTER: shadow(color=blue，direction=225)
}
.shadow1 {
FILTER: shadow(color=red，direction=225)
}
.shadow2 {
FILTER: shadow(color=green，direction=225)
}
.div {
CURSOR: move; FILTER: blur(add=ture，direction=135，strength=10); WIDTH: 800px
}
</STYLE>
在這里應用的是blur濾鏡。
2、在頁面中插入一張圖片，比如我插入是<img border="0" src="http://www.okasp.com/techinfo/file:///F:/hbg/圖象/校園/武測美景/廣場夜景.jpg" width="300" height="210">。在其前加入<TD id=flttgt style="filter: light(enabled=1)，'width 300'" width=315>。
在剛才我們插入圖片下一行中加入<TD style="VERTICAL-ALIGN: top" width=314><SPAN id=holder stylefont-size:14ptcolor:yellow?>。（把鼠標移到圖片上，光源會跟蹤鼠標。單擊圖片加入其他光源并且跟隨鼠標移動。)
3、在設置了圖片屬性后，我們還要應用JavaScript腳本代碼，也就是使圖片跟隨鼠標移動一些特效，代碼如下。
<SCRIPT language=JavaScript>
<!--
var g_numlights=0;
var blurbs= new Array(" 現在的動態濾鏡賦予了網頁更多的交互性能來響應用戶的動作。"，" 我們使用了光源濾鏡來響應用戶的點擊。點擊圖片可以增加光源。"，" 通過捕捉用戶鼠標位置的方法來移動光源。"，" 不需要太多的編程。");
window.onload=setlights;
document.onclick=keyhandler;
flttgt.onmousemove=mousehandler;
function setlights(){
flttgt.filters[0].clear();
flttgt.filters[0].addcone(0，0，5，100，100，225，225，0，60，15);
if (g_numlights>0){
flttgt.filters[0].addcone(400，170，5，100，100，225，0，0，160，15);
if (g_numlights>1){
flttgt.filters[0].addcone(320，330，5，100，100，0，225，225，60，15);
}
}
}
function keyhandler()
{
g_numlights=(g_numlights+=1)%4;
holder.innerHTML=blurbs[g_numlights];
setlights();
}
function mousehandler()
{
x=(window.event.x-80);
y=(window.event.y-80);
flttgt.filters[0].movelight(1，x，y，5，1);
if(g_numlights>0){
flttgt.filters[0].movelight(1，x，y，5，1);
if(g_numlights>1)
{
flttgt.filters[0].movelight(2，x，y，5，1);
}
}
}
</SCRIPT>
（出處：賽迪網）大多數人在上網的時候，都會瀏覽網頁提供給我們的信息。
| 
