皇家社会vs莱万特
聊城萬拓網絡科技-專業聊城網站建設、聊城網站制作、聊城網站優化、聊城做網站的品牌網站建設專家!

    您當前的位置是:首頁 - 新聞動態 - 網站設計 ? 自己收集的用CSS定義鼠標的樣式代碼

    自己收集的用CSS定義鼠標的樣式代碼
     發布時間:2014-04-09  點擊次數: 次   作者:萬拓網絡  來源:lcbaituo.com  Tags:

    在CSS中定義啊,看下面的內容對你有沒有幫助:
    啟動Dreamweaver,打開你要應用鼠標樣式的網頁,在主窗口中選擇Text下拉菜單,再選擇CSS Style子菜單中的New Style命令新建樣式表。(注:如果你的網頁中已經存在樣式表,可以選擇CSS Styles' Edit Style Sheet編輯樣式表。)
    此時彈出New Style對話框。其中Type項有三個單選按鈕:Make Custom Style、Redefine HTML Tag、Use CSS Selector。其中Make Custom Style 是自定義樣式,樣式名以圓點開頭;Use CSS Selector是使用CSS選擇器,里邊包含四個超鏈接樣式a:active/a:hover/a:link/a:visited;Redefine HTML Tag是定義HTML系統標簽的樣式,如a\body\br等等。假設我們只對該頁面的超鏈接設置鼠標樣式,這里選擇Redefine HTML Tag選項中的a標簽。下面的Define項選擇This Document Only。單擊OK按鈕。

    彈出Style definition for 對話框,進入超鏈接樣式設置。左邊的Category是樣式類別,這里對其它項不作解釋,我們選擇Extentions項。可以看到右邊Visual Effect中的Cursor項,這就是設置鼠標樣式的關鍵項。單擊右邊的下拉菜單,選擇你所需要的鼠標樣式,單擊OK按鈕就可以了。

    下面講一下各樣式的大致含義。


    hand:是大家所熟悉的手型。
    crosshair:是十字型,就是小烏龜首頁所用的樣式。
    text:是平時鼠標移動到文本上的樣式。
    wait:是等待的效果。
    default:是默認的那種效果。
    help:是帶問號的鼠標樣式。
    e-resize:是向右的箭頭。
    ne-resize:是向右上方的箭頭。
    n-resize:是向上的箭頭。
    nw-resize:是向左上方的箭頭。
    w-resize:是向左的箭關。
    sw-resize:是向左下的箭頭。
    s-resize:是向下的箭頭。
    se-resize:是向右下方的箭頭。
    auto:是系統自動的效果。 

    當然根據需要你也可以將樣式應用于其它標簽,或者單純的只應用于某一段文本。如果讀者對CSS代碼不陌生的話,或許直接手寫代碼更方便。特別是,如果你想在不同的位置運用不同的鼠標樣式,或者不同的標簽使用不同的鼠標樣式。直接將樣式寫在某個具體的標簽里邊就可以了。

    方法是:<tag style="cursor:mouse_style">。其中tag是標簽名,mouse_style就是鼠標樣式,如hand/crosshair/text/wait等等。


    下面舉個具體的實例以加深大家對鼠標樣式設置的理解。


    <span style="cursor:hand"> hand:是大家所熟悉的手型。</span><br>
    <span style="cursor:crosshair">crosshair:是十字型,就是小烏龜首頁所用的樣式。</span><br>
    <span style="cursor:text">text:是平時鼠標移動到文本上的樣式。</span><br>
    <span style="cursor:wait">wait:是等待的效果。</span><br>
    <span style="cursor:default">default:是默認的那種效果。</span> <br>
    <span style="cursor:help">help:是帶問號的鼠標樣式。</span><br>
    <span style="cursor:e-resize">e-resize:是向右的箭頭。</span><br>
    <span style="cursor:ne-resize">ne-resize:是向右上方的箭頭。</span><br>
    <span style="cursor:n-resize">n-resize:是向上的箭頭。</span><br>
    <span style="cursor:nw-resize">nw-resize:是向左上方的箭頭。</span><br>
    <span style="cursor:w-resize">w-resize:是向左的箭關。</span><br>
    <span style="cursor:sw-resize">sw-resize:是向左下的箭頭。</span><br>
    <span style="cursor:s-resize">s-resize:是向下的箭頭。</span><br>
    <span style="cursor:se-resize">se-resize:是向右下方的箭頭。</span><br>
    <span style="cursor:auto">auto:是系統自動的效果。</span>



    分享到:
    上一篇:我收集的一些網頁制作網址,這些都是大的,先貼出來。
    下一篇:一些日本的素材象素圖網站
     

    本站業務:聊城網站建設-聊城網站制作-聊城做網站  
    皇家社会vs莱万特 时时彩网站 什么彩票是玩大小单双 高手打麻将算牌原理 时时彩规律技巧 福建时时走势图 全天北京pk10赛车计划 三牛娱乐登录网址 重庆彩五星基本走势图 正版彩票2019 乐翻二人麻将苹果版 宾利娱乐可以控制吗 棋牌娱乐app