• <sub id="h4knl"><ol id="h4knl"></ol></sub>
    <sup id="h4knl"></sup>
      <sub id="h4knl"></sub>

      <sub id="h4knl"><ol id="h4knl"><em id="h4knl"></em></ol></sub><s id="h4knl"></s>
      1. <strong id="h4knl"></strong>

      2. html文字超鏈接變色

        時間:2024-05-31 10:14:38 HTML DOM 我要投稿
        • 相關推薦

        html文字超鏈接變色

          導語:CSS為一些特殊效果準備了特定的工具,我們稱之為“偽類”。其中有幾項是我們經常用到的,下面我們就詳細介紹一下經常用于定義鏈接樣式的四個偽類 定義鏈接樣式。

          :link

          :visited

          :hover

          :active

          因為我們要定義鏈接樣式,所以其中必不可少的就是超級鏈接中的錨標簽--a,錨標簽和偽類鏈接起來書寫的方法就是定義鏈接樣式的基礎方法,它們的寫法如下:

          a:link,定義正常鏈接的樣式;

          a:visited,定義已訪問過鏈接的樣式;

          a:hover,定義鼠標懸浮在鏈接上時的樣式;

          a:active,定義鼠標點擊鏈接時的樣式。

          示例:

          代碼如下:

        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        11
        12
        13
        14
        15
        16
        a:link {          
        color:#FF0000;          
        text-decoration:underline;          
        }          
        a:visited {          
        color:#00FF00;          
        text-decoration:none;          
        }          
        a:hover {          
        color:#000000;          
        text-decoration:none;          
        }          
        a:active {          
        color:#FFFFFF;          
        text-decoration:none;          
        }          

          上面示例中定義的鏈接顏色是紅色,訪問過后的鏈接是綠色,鼠標懸浮在鏈接上時是黑色,點擊時的顏色是白色。

          如果正常鏈接和已訪問過的鏈接樣式相同,鼠標懸浮和點擊時的樣式相同,也可以將它們合并起來定義:

          代碼如下:

        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        a:link,          
        a:visited {          
        color:#FF0000;          
        text-decoration:underline;          
        }          
        a:hover,          
        a:active {          
        color:#000000;          
        text-decoration:none;          
        }          

          鏈接定義的順序

          沒有規矩不成方圓,雖然鏈接定義寫好了,但它也是有規則的,如果這四項的書寫順序稍有差錯,鏈接的效果可能就沒有了,所以每次定義鏈接樣式時務必確認定義的順序,link--visited--hover-active,也就是我們常說到的LoVe HAte原則(大寫字母就是它們的首字母)。

          定義局部鏈接樣式

          在CSS中寫上a:link{}這樣的定義會使整個頁面的鏈接樣式改變,但有些局部鏈接需要特殊化,這個問題也不難解決,只要在鏈接樣式定義的前面加上指定的id或class就可以了。

          示例:

        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        #sidebar a:link,          
        #sidebar a:visited {          
        color:#FF0000;          
        text-decoration:none;          
        }          
        #sidebar a:hover,          
        #sidebar a:active {          
        color:#000000;          
        text-decoration:underline;          
        }          

          調用方法:

          class的定義方法和id相同,只要將#sidebar改為.sidebar就行了,還有一種方法是直接定義鏈接的樣式,那樣更直接,不過調用時比較麻煩,需要給每個特定的鏈接加上定義的代碼。

          示例:

        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        11
         a.redlink a:link,          
        a.redlink a:visited {          
        color:#FF0000;          
        text-decoration:none;          
        }          
        a.redlink a:hover,          
        a.redlink a:active {          
        color:#000000;          
        text-decoration:underline;          
        background:#FFFFFF;          
        }          

          調用方法:

          鏈接的定義主要有三個屬性,顏色(color)、文本修飾(text-decoration)和背景(background)

        【html文字超鏈接變色】相關文章:

        word清除超鏈接10-24

        HTML的語言剖析10-13

        過濾HTML代碼08-29

        ppt怎么制作超鏈接10-01

        word設置超鏈接文件10-19

        HTML5和HTML4有何區別?08-29

        收集的常用的HTML標簽01-22

        HTML語言的網頁教程06-14

        什么是HTML相關的介紹08-08

        HTML5的發展08-15

        国产高潮无套免费视频_久久九九兔免费精品6_99精品热6080YY久久_国产91久久久久久无码
      3. <sub id="h4knl"><ol id="h4knl"></ol></sub>
        <sup id="h4knl"></sup>
          <sub id="h4knl"></sub>

          <sub id="h4knl"><ol id="h4knl"><em id="h4knl"></em></ol></sub><s id="h4knl"></s>
          1. <strong id="h4knl"></strong>

          2. 亚洲欧洲日本精品专线 | 亚洲s色大片在线观看 | 天天在线视频精品分类 | 在线观看网站深夜免费AV | 青娱乐极品视觉一区二区 | 亚洲午夜国产AV中文乱码字幕 |