<sub id="5j3hf"><thead id="5j3hf"><i id="5j3hf"></i></thead></sub>

      <menuitem id="5j3hf"></menuitem>
      北京網站建設>前端開發>Css>

      Css

      【精編Css教程】5-超鏈接偽類

      來源:未知 作者:admin 時間:2015-10-30 16:43 點擊:

      鏈接的四種樣式

      將鏈接轉換為塊狀

      用css制作按鈕

      首字下沉

      一、超鏈接的四種樣式

      本來計劃這節課放到第九章中講解,但下邊的章節都涉及到了,所以提前來學習一下,上節課講解的內容比較多,這節課就少講些,只要理解了偽類,就輕松多了。

      超鏈接可以說是網頁發展史上一個偉大的發明,它使得許多頁面相互鏈接從而構成一個網站。說到超鏈接,它涉及到一個新的概念:偽類,我們先看下超鏈接的四種樣式:

      a:link {color: #FF0000} /* 未訪問的鏈接 */

      a:visited {color: #00FF00} /* 已訪問的鏈接 */

      a:hover {color: #FF00FF} /* 鼠標移動到鏈接上 */

      a:active {color: #0000FF} /* 選定的鏈接 */

      以上分別定義了超鏈接未訪問時的鏈接樣式,已訪問的鏈接樣式,鼠標移上時鏈接樣式和選定的鏈接樣式。之所以稱之為偽類,也就是說它不是一個真實的類,正常的類是以點開始,后邊跟一個名稱,而它是以a開始后邊跟個冒號,再跟個狀態限定字符;比如第三個a:hover的樣式,只有當鼠標移動到該鏈接上時它才生效,而a:visited只對已訪問過的鏈接生效。偽類使得用戶體驗大大提高,比如我們可以設置鼠標移上時改變顏色或下劃線等屬性來告知用戶這個是可以點擊的,設置已訪問過的鏈接的顏色變灰暗或加刪除線告知用戶這個鏈接的內容已訪問過了。

      下面來做一個默認狀態下是藍色,鼠標放上是紅色加下劃線,選定(按下)時為紫色,已訪問過為灰色加刪除線的實例來講解一下。首先插入兩個帶超鏈接的內容:

      < p>< a href="#">這里是鏈接< /a>

      < p>< a href="10.html">這里也是鏈接< /a>

      從上圖中可以看出,插入的超鏈接默認是藍色來下劃線的,這是標簽的默認樣式所致,下來我們在css樣式中定義

      設置完a:link的樣式后,下面分別設置a:visited ,a:hover ,a:active的樣式

      生成的源代碼如下:

      注意:四種狀態的順序一定不能顛倒,否則有些不生效

      公司業務:北京網站建設刷百度下拉刷百度指數虛擬主機租用

      如轉載,請保留本文鏈接地址:http://www.zzpkf.com/Style/Css/1767/

      Loading......
      工作時間:

      AM 09:00 ~ 12:00

      PM 14:00 ~ 18:00

      聯系方式:

      Tel 010-50933590

      Hp 18701620736

      設計優勢

      獨立的設計團隊 帶給您全新的視覺體驗

      功能開發

      強大的技術實力,完成您想要的任何功能

      售后服務

      完善的售后服務,解決您在使用過程中遇到的問題

      Copyright © 2010 - 2018 北京順晟科技發展有限公司 All Rights Reserved

      地址:北京市順義區南法信政府府前街16號 炫立方 | TEL:010-50933590

      北京網站建設 | 北京網站設計 | 北京SEO公司

      11选5河南最新开奖今天