1. 程式人生 > 其它 >CSS3----偽類與偽類元素選擇器--連結偽類和錨點偽類

CSS3----偽類與偽類元素選擇器--連結偽類和錨點偽類

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            a{
                text-decoration: none;
            }
            a:link{
                color: #bfa;
            }
            a:visited
{ color: pink; } </style> </head> <body> <!-- :link 表示作為超連結,並指向一個未訪問的地址的所有錨 --> <a href="#">顛顛地那</a> </body> </html>

/*連結偽類*/ 注意:link,:visited,:target是作用於連結元素的!
:link 表示作為超連結,並指向一個未訪問的地址的所有錨
:visited 表示作為超連結,並指向一個已訪問的地址的所有錨

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            *{
                margin: 0;
                padding: 0;
            }
            a{
                text-decoration: none;
                color
: #BBFFAA; } div{ width: 200px; height: 200px; background: pink; display: none; text-align: center; font: 50px/200px helvetica; } :target{ display: block; } </style> </head> <body> <a href="#div1">a</a> <a href="#div2">v</a> <a href="#div3">b</a> <div id="div1"> a </div> <div id="div2"> v </div> <div id="div3"> b </div> </body> </html>

:target 代表一個特殊的元素,它的id是URI的片段識別符號