主頁(yè) > 知識(shí)庫(kù) > 調(diào)整CSS類型的順序改變鏈接翻滾效果

調(diào)整CSS類型的順序改變鏈接翻滾效果

熱門標(biāo)簽:北京銷售外呼系統(tǒng)線路 電銷機(jī)器人的宣傳語 電銷智能機(jī)器人靠譜么 沸思外呼線路 南通電話外呼系統(tǒng)開發(fā) 南寧外呼電銷系統(tǒng)招商 400電話辦理安徽 江西防封卡外呼系統(tǒng)怎么安裝 石家莊電話機(jī)器人電話

你也許已經(jīng)意識(shí)到,你可以通過指定每一鍵接的不同風(fēng)格以建立CSS翻滾效果,這些鏈接包括普通的鏈接link (normal), 訪問,翻轉(zhuǎn),以及激活。并且,你可能也知道CSS類型的順序可以產(chǎn)生效果上的差別,CSS代碼后順序的風(fēng)格將會(huì)取代針對(duì)于相同元素的前順序的風(fēng)格。建立翻滾效果的類型順序顯得相當(dāng)重要。
    現(xiàn)在讓我們看看如何安排鏈接狀態(tài)的類型在不產(chǎn)生沖突的情況下支持正常的翻滾效果,并且如何重新安排這些類型順序以獲得不同的翻滾效果。

    鏈接狀態(tài)

    典型的CSS翻滾效果依賴于超鏈接中四個(gè)狀態(tài)之一的獨(dú)立類型。可以建立附帶CSS預(yù)先類的<A>(超鏈接)類型以指定鏈接狀態(tài):

a:link——常規(guī),非訪問超鏈接

a:visited——訪問超鏈接

a:hover——訪問者操作鼠標(biāo)通過時(shí)的鏈接

a:active——點(diǎn)擊鏈接

    為了能夠使典型的CSS翻滾效果正常工作,CSS代碼中的CSS類型順序顯得非常重要,無論它是一個(gè)外部類型表格或者是嵌入在HIML頁(yè)標(biāo)題欄中的類型規(guī)則。

    a:link類型出現(xiàn)的時(shí)間為最早,因?yàn)樗蓱?yīng)用于所有的鏈接。a:visited類型排第二,它將取代任何鏈接的a:link格式。(如果a:link類型緊跟著的是a:visited,a:link可能會(huì)取代a:visited類型。)其次是a:hover類型,此類型只應(yīng)用于訪問鼠標(biāo)下的鏈接。最后是a:active,所以,當(dāng)鏈接被點(diǎn)擊時(shí),它可以取代所有其它的類型。

a:link {

    color: #0000FF;

    text-decoration: underline;

    font-weight: normal;

    font-style: normal;

}

a:visited {

    color: #3399FF;

    text-decoration: underline;

    background-color: #FFFFFF;

    font-weight: normal;

    font-style: italic;

}

a:hover {

    color: #0000FF;

    text-decoration: underline;

    background-color: #FFFF00;

    font-weight: bold;

    font-style: normal;

}

a:active {

    color: #FF0000;

    text-decoration: none;

    background-color: #CCCCCC;

    font-weight: bold;

    font-style: normal;

}

    在CSS代碼中的類型順序確定了每一種類型如何取代其它的類型,即更多的類型可以應(yīng)用到特定的元素。正常情況下,a:hover類型處于a:link和a:visited類型之后,所以hover狀態(tài)的類型可以應(yīng)用于常規(guī)和訪問的鏈接。但是,它也并非必須遵循這一方式,你可以改變類型順序?qū)崿F(xiàn)不同的效果。

    假設(shè)你想在非訪問鏈接中使用翻滾效果,但不想影響到其它訪問鏈接,你或許想到通過代碼來處理這種外形上改變,然而你所要做的是重新組織CSS代碼。

    從訪問鏈接中移除翻滾效果,可以通過很簡(jiǎn)單地移除a:visited類型。

    注意,a:visited類型中包含指定所有與a:hover相同屬性的規(guī)則,否則,當(dāng)訪問者的鼠標(biāo)通過一個(gè)訪問鏈接時(shí),沒有被a:visited類型取代的任何a:hover類型屬性將會(huì)繼續(xù)再現(xiàn)。

來源:網(wǎng)頁(yè)教學(xué)網(wǎng)

您可能感興趣的文章:
  • CSS圖片翻轉(zhuǎn)菜單
  • 代碼實(shí)例之純CSS代碼實(shí)現(xiàn)翻頁(yè)效果
  • 7款吸引人眼球的jQuery/CSS3特效實(shí)例分享
  • wap手機(jī)圖片滑動(dòng)切換特效無css3元素js腳本編寫
  • 2014 HTML5/CSS3熱門動(dòng)畫特效TOP10
  • jQuery+CSS3實(shí)現(xiàn)樹葉飄落特效
  • jquery+css3實(shí)現(xiàn)網(wǎng)頁(yè)背景花瓣隨機(jī)飄落特效
  • js+css實(shí)現(xiàn)上下翻頁(yè)相冊(cè)代碼分享
  • JS+CSS實(shí)現(xiàn)鼠標(biāo)滑過時(shí)動(dòng)態(tài)翻滾的導(dǎo)航條效果
  • CSS3實(shí)現(xiàn)動(dòng)態(tài)翻牌效果 仿百度貼吧3D翻牌一次動(dòng)畫特效

標(biāo)簽:晉中 寧夏 云南 陽泉 來賓 衢州 鹽城 北海

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《調(diào)整CSS類型的順序改變鏈接翻滾效果》,本文關(guān)鍵詞  調(diào)整,CSS,類型,的,順序,改變,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《調(diào)整CSS類型的順序改變鏈接翻滾效果》相關(guān)的同類信息!
  • 本頁(yè)收集關(guān)于調(diào)整CSS類型的順序改變鏈接翻滾效果的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章