css - 如何在切换IMg2 img3 img4的时候第一张图片消失
大家讲道理
大家讲道理 2017-04-17 11:32:09
0
1
542
<!DOCTYPE html>
<html >
<head>
    <title> new document </title>
    <meta charset="utf-8" />  
    <style>
    #pic{
        width:350px;
        height:350px;
        border:1px solid #ddd;
        margin-top:20px;
    }
    #link a{
        diaplay:inline-block;
        border:1px solid #ddd;
        background-color:gray;
        padding:5px 10px;
    }
    #pic a img:not([class='pic1']){
        display:none;
    }
    #pic a:target img{
        display:block;
    }
    </style>
</head>
<body>
    <p id='link'>
        <a href='#img1'>img1</a>
        <a href='#img2'>img2</a>
        <a href='#img3'>img3</a>
        <a href='#img4'>img4</a>
    </p>
    <p id='pic'>
        <a name='img1'><img src='images/p001.jpg' class='pic1' /></a>
        <a name='img2'><img src='images/p002.jpg'  class='pic2' /></a>
        <a name='img3'><img src='images/p003.jpg'  class='pic3' /></a>
        <a name='img4'><img src='images/p004.jpg' class='pic3' /></a>
    </p>
</body>
</html>
大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

모든 응답(1)
黄舟

用jquery的$('#img1').css('display','none');

최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿