用a标签实现锚点链接


css:

<style>
        *{
            margin: 0;
            padding: 0;
        }
        img{
            width: 800px;
            height: 500px;
            margin-bottom:200px;
        }
        div{
            top: 100px;
            right: 200px;
            position: fixed;
        }
        a{
            display: block;
            font-size: 20px;
        }
    </style>

html:

<body>
    <img src="../img/1.jpg" alt="" id="pic1">
    <img src="../img/2.jpg" alt="" id="pic2">
    <img src="../img/3.jpg" alt="" id="pic3">
    <img src="../img/4.jpg" alt="" id="pic4">
    <img src="../img/5.jpg" alt="" id="pic5">
    <div>
        <!--a标签的href属性取值为所要链接到的块的id选择器-->
        <!--如这里的#pic1就是要链接到第一个id为pic1的img元素-->
        <a href="#pic1">图1</a>
        <a href="#pic2">图2</a>
        <a href="#pic3">图3</a>
        <a href="#pic4">图4</a>
        <a href="#pic5">图5</a>
    </div>    
</body>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM