滑鼠划過字型時如何用css來實現字型變色?(代碼實測)

來源:互聯網
上載者:User
當我們在瀏覽網頁時,滑鼠划過某段文字會出現變色效果,這就是css字型變色,一方面是為了主動吸引人使用者目光去點擊,另一方面是為了防止使用者點擊錯其他文欄位落。其實這種css滑鼠經過字型變色的效果是非常容易實現的。只要你略懂css知識都可以實現操作。

主要知識點就是滑鼠移至上方在CSS中寫為HOVER,滑鼠觸發在CSS中寫為ACTIVE。

css滑鼠經過字型變色效果實現的具體程式碼範例如下:

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>css字型變色測試</title></head><style>    a {        color:black}    a:hover {        color:red }    a:active {        color:blue}</style><body><a>    你過來指我試試!!!</a></body></html>

以上代碼可以直接複製在本地測試。

註:a後面的color:red;等於連結文字為黑色,a:hover 的 color:black;等於滑鼠移動到連結文字上後為紅色, a:active 的 color:blue;等於滑鼠點選連結文字後為藍色。

那麼希望本篇文章關於css滑鼠經過字型變色效果如何?的問題介紹,對大家有所協助!

【相關內容推薦】

CSS中關於文本字型顏色(CSS color)的詳解

html和css中字型顏色設定的相關總結

字型顏色背景色的設定

CSS如何?文字色彩坡形的執行個體

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.