DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> DIV十CSS布局 >> 布局實例 >> 網站制作如何用CSS控制超鏈接樣式
網站制作如何用CSS控制超鏈接樣式
編輯:布局實例     

  

  網站制作用CSS可控制超鏈接樣式,一般分為四個部分:a:active是超級鏈接的初始狀態;a:hover是把鼠標放上去時的狀況;a:link 是鼠標點擊時;a:visited是訪問過後的情況。


CSS控制超鏈接的三種方法


1、通過對應超鏈接外的父級的css類的css樣式來控制超鏈接的樣式


案例超鏈接代碼<div class="yangshi"><a href="http://www.wangqi.com/">CSS</a></a>


對應CSS代碼


.yangshi a{color:#333;text-decoration:none; }


.yangshi a:hover {color:#CC3300;text-decoration:underline;}


2、通過鏈接內設置類控制超鏈接樣式css方法


案例超鏈接代碼<a href=http://www.wangqi.com/ class="yangshi">CSS</a>


對應CSS代碼


a.yangshi{color:#333;text-decoration:none; }


a.yangshi:hover {color:#CC3300;text-decoration:underline;}


通過這樣的設置可以控制鏈接內的css類名為“yangshi”超鏈接的樣式


3、通常對全站超鏈接樣式化方法


a{color:#333;text-decoration:none; } //對全站有鏈接的文字顏色樣式為color:#333;並立即無下劃線text-decoration:none;


a:hover {color:#CC3300;text-decoration:underline;}//對鼠標放到超鏈接上文字顏色樣式變為color:#CC3300;並文字鏈接加下劃線text-decoration:underline;

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved