網(wǎng)頁設計中的移動光標和圖形光標

2022-06-07    分類: 網(wǎng)站建設

移動光標

在很多情況下,move值會得到與crosshair類似的結果。創(chuàng)作人員在設計網(wǎng)頁時,需要指示一個屏幕元素可以移動時就會使用move,它通常顯示為一個加粗的十字線,線的兩端分別有箭頭。也可以顯示為一個“拳頭”,用戶點擊并按下鼠標按鈕時圖標中的“手指”是彎曲的。

還有一些與move相關的cursor值:e-resize、ne-resize等等。Windows和大多數(shù)圖形化UniX-sheU用戶會把這些值識別為鼠標光標放在窗口一邊或角落時出現(xiàn)的圖標。例如,在網(wǎng)站建設時,把光標放在窗口的右邊界上會出現(xiàn)一個e-resize光標,指示用戶可以把窗口的右邊3)6回拖動來改變窗口大小。把光標放在左下角則會顯示sw-resize光標圖標。有很多不同的方法可以表現(xiàn)這些圖標。

等待和前進

wait和progress都指示程序正在忙。不過,它們并不相同:wait表示用戶要等待直到程序不忙為止,而progress指示用戶完全可以繼續(xù)與程序交互,盡管它很忙。在大多數(shù)操作系統(tǒng)中,wait可能顯示為一塊表(可能有旋轉的指針)或者顯示為一個沙漏(可能在自己倒來倒去)。progress通常表示為一個旋轉的“沙灘球”,或者是一個箭頭,而且在這個箭頭的一旁有一個小沙漏。

注意:值progress在CSS2.1中引入。

提供幫助

有時創(chuàng)作人員在網(wǎng)頁設計時希望指示用戶可以得到某種形式的幫助,此時就可以使用值help。help 有兩種非常常見的表現(xiàn)方式,可能是一個問號;也可能是一個箭頭,箭頭旁邊有一個小問號,如果已經確定某些鏈接指向更多信息,或者這些鏈接指向的信息有助于用戶更好地理解網(wǎng)頁,help就很有用。例如:

a.help {cursor: help;}

還可以使用help指示一個元素有“額外”信息,如有title屬性的acronym元素,在很多用戶代理中,把光標放在一個有標題的縮寫詞上時,用戶代理會在一個“工具提示”中顯示title屬性的內容。不過,如果用戶把光標移動得很快,或者用戶的計算機速度很慢,倘若光標沒有改變,用戶可能不知道還有額外的信息。

圖形光標

最后也是最有意思的一點是,在網(wǎng)頁設計時還可以指定定制光標。這可以使用一個URL值做到:

a.external {cursor: url(globe.cur), pointer;}

當然,用戶代理必須支持存儲"所用的文件格式。如果用戶代理不支持這種格式,就會轉而使用值pointer。注意,在cursor語法定義中,URL必須跟有一個逗號和某個通用關鍵字。這與屬性font-family不同,對于font-family,可以指定一個特定字體系列而不必提供任何后路。實際上,對于可能采用的任何圖形光標,cursor 都要求有后路。

甚至可以在作為后路的關鍵字之前指定多個光標文件。例如,可以用不同格式創(chuàng)建同樣的基本光標,把它們放在一個規(guī)則中,希望用戶代理至少支持其中的一個:

a.external {cursor: url(globe.svg#globe), url(globe.cur), url(globe.png), url(globe.gif), url(globe.xbm), pointer;}

用戶代理會逐個査看各個URL,直到找到一個可以用作為光標圖標的文件。如果用戶代理無法找到任何支持的文件,就會使用作為后路的關鍵字。

注意:如果用戶代理支持動畫圖形文件來替換光標,就可以實現(xiàn)動畫光標,例如,IE6就支持利用。ani文件實現(xiàn)這種功能。


網(wǎng)頁名稱:網(wǎng)頁設計中的移動光標和圖形光標
標題來源:http://muchs.cn/news/164547.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供移動網(wǎng)站建設、軟件開發(fā)、建站公司商城網(wǎng)站、電子商務、全網(wǎng)營銷推廣

廣告

聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

h5響應式網(wǎng)站建設