超鏈接的代碼
<a href="http://www.divcss5.com/" target="_blank" title="關於div css的網站">DIV+CSS</a>
解析如下:
href 后跟被鏈接地址目標網站地址這里是http://www.divcss5.com/
target
_blank -- 在新窗口中打開鏈接
_parent -- 在父窗體中打開鏈接
_self -- 在當前窗體打開鏈接,此為默認值
_top -- 在當前窗體打開鏈接,並替換當前的整個窗體(框架頁)
title 后跟鏈接目標說明,也就是超鏈接被鏈接網址情況簡要說明,或標題
CSS可控制超鏈接樣式-css鏈接樣式如下
a:active是超級鏈接的初始狀態
a:hover是把鼠標放上去時的狀況
a:link 是鼠標點擊時
a:visited是訪問過后的情況
超鏈接樣式案例
1、通常對全站超鏈接樣式化方法
a{color:#333;text-decoration:none; } //對全站有鏈接的文字顏色樣式為color:#333;並立即無下划線text-decoration:none;
a:hover {color:#CC3300;text-decoration:underline;}//對鼠標放到超鏈接上文字顏色樣式變為color:#CC3300;並文字鏈接加下划線text-decoration:underline;
2、通過鏈接內設置類控制超鏈接樣式css方法
案例超鏈接代碼<a href="http://www.divcss5.com/" class="yangshi">CSS</a>
對應CSS代碼
a.yangshi{color:#333;text-decoration:none; }
a.yangshi:hover {color:#CC3300;text-decoration:underline;}
通過這樣的設置可以控制鏈接內的css類名為“yangshi”超鏈接的樣式
3、通過對應超鏈接外的父級的css類的css樣式來控制超鏈接的樣式
案例超鏈接代碼<div class="yangshi"><a href="http://www.divcss5.com/">CSS</a></a>
對應CSS代碼
.yangshi a{color:#333;text-decoration:none; }
.yangshi a:hover {color:#CC3300;text-decoration:underline;}
這里值得注意的是a.yangshi與.yangshi a的樣式css代碼區別