| <script type="text/javascript"> var arrBaiduCproConfig=new Array(); arrBaiduCproConfig['uid'] = 2214; arrBaiduCproConfig['n'] = 'sayyescpr'; arrBaiduCproConfig['tm'] = 48; arrBaiduCproConfig['cm'] = 100; arrBaiduCproConfig['um'] = 50; arrBaiduCproConfig['rad'] = 1; arrBaiduCproConfig['w'] = 336; arrBaiduCproConfig['h'] = 280; arrBaiduCproConfig['bd'] = '#ffffff'; arrBaiduCproConfig['bg'] = '#ffffff'; arrBaiduCproConfig['tt'] = '#0000ff'; arrBaiduCproConfig['ct'] = '#000000'; arrBaiduCproConfig['url'] = '#666666'; arrBaiduCproConfig['bdl'] = '#CCCCCC'; arrBaiduCproConfig['wn'] = 1; arrBaiduCproConfig['hn'] = 4; arrBaiduCproConfig['ta'] = 'center'; arrBaiduCproConfig['tl'] = 'top'; arrBaiduCproConfig['bu'] = 1; </script><script src="http://cpro.baidu.com/cpro/ui/ui.js" type="text/javascript"> </script><script type="text/javascript"> <!-- document.write(baiduCproIFrame()); --> </script> |
這一次還是繼續爲大家介紹一些樣式表應用方面的技巧。大家知道樣式表的定義是針對容器(tag)而言的，那麼在HTML 中，Anchor(錨，即超級鏈接標記)是一類作用非常之大的容器。它實現了HTML最根本的功能（超文本，超鏈接）。而CSS也有關於Anchor的一些特殊用法。使得頁面的聯接更緊湊，更富有條理。
跟其它的tag一樣，Anchor的定義方法也可以是：
A:{css標記}
可是它特殊之處在於，它有各種相關的屬性，比如visited(瀏覽過)，active(激活)，hover(鼠標在其上)，link（有鏈接）。可以根據不同需要而做出專門的定義以根據用戶不同的動作做出反應，從而形成比較好的效果。
比如說，您可以做以下的定義：
< html>
< head>
< title>Untitled Document< /title>
< meta http-equiv="Content-Type" content="text/html; charset=gb2312">
< style type="text/css">
< !-- a:active { font-family: "宋體"; font-size: 9pt; color: #9999FF; text-decoration: underline}a:hover { font-family: "宋體"; font-size: 9pt; color: #99FF99; text-decoration: underline}a:link { font-family: "宋體"; font-size: 9pt; color: #FFCCCC; text-decoration: none}-->
< /style>
< /head>
< body bgcolor="#000000">
< a href="www.www.www">返回< /a>
< /body>
< /html>
 |  |
圖一 | 圖二 |
在這個例子中，定義了錨的active,hover,link三種狀態。當例子中存在着超級鏈接時，就會呈現出如圖一的沒有下劃線的淡紅，而將鼠標置於其上時，鼠標變成了手形，而這個鏈接則會呈現出如圖二的亮綠色。而一旦訪問過後，該鏈接則會呈現出深紅色。這種變化既美觀了頁面，又提醒了用戶。爲絕大多數網站採用。
事實上，有很多時候我們在沒有使用錨的時候也需要對象根據用戶的動作作一些改變。這時候我們往往需要當用戶控制鼠標經過該對象時，能夠給他一些提示。比如鼠標換個形狀。像手形，十字形之類的，再結合必要的javascript，不就可以出現很炫的效果了嗎？而且很多時候使用了錨的話容易改變當前焦點。比如當我們使用到Dhtml中的層概念時，如果是層是不可見的，利用錨將其改爲可視，可一旦鼠標移上去以後，焦點馬上到了層的上面，令大家感到非常不方便。不過，css裏面剛好有這個屬性，可以幫我們改變鼠標屬性，解除這個煩惱。我們現在就看這個例子：
< html>
< head>
< title>測試一< /title>
< meta http-equiv="Content-Type" content="text/html; charset=gb2312">
< style type="text/css">
< !-- .text1 { font-family: "宋體"; font-size: 9pt; color: #9999FF; cursor: crosshair}
-->
< /style>
< /head>
< body bgcolor="#FFFFFF">
< p align="center" class="text1" onClick="javascript:{window.close()}">關閉窗口< /p>
< /body>
< /html>
這裏的關閉窗口的這個文字鼠標屬性爲一個十字，所以當移上去時，鼠標就變化爲十字形。而點擊它則會出現關閉窗口事件。
這個屬性能使用的鼠標形狀還有：
crosshair:十字；
hand:手形；
text:文本光標；
wait:沙漏；
help:問號；
e-resize:右箭頭；
ne-resize:右上向箭頭；
n-resize:向上箭頭；
nw-resize:左上箭頭；
w-resize:向左箭頭；
sw-resize:左下箭頭；
s-resize:向下箭頭；
se-resize:右下箭頭。
好了，關於css的一些技巧性的東西就爲大家介紹到這裏啦。
