您的位置: 首页  >  技术问答  >  如何在网页中，为文字设置超链接，鼠标碰到超链接时，会在左侧区域显示出图片 请问怎么设置呀

如何在网页中，为文字设置超链接，鼠标碰到超链接时，会在左侧区域显示出图片 请问怎么设置呀

分类: 技术问答 • 2022-03-02 19:27:46

如何在网页中，为文字设置超链接，鼠标碰到超链接时，会在左侧区域显示出图片 请问怎么设置呀

问题描述：

如何在网页中，为文字设置超链接，鼠标碰到超链接时，会在左侧区域显示出图片 请问怎么设置呀

答 

    <style>
        img{
            visibility: hidden;
        }
        a:hover + img {
            visibility: visible;
        }
      /* 调整图片与链接的位置 */
        .box{
            display: inline-flex;
            flex-direction: row-reverse;
        }
    </style>

    <body>
        <div class="box">
            <a href="#">这是个链接</a>
            <img src="../6bfcdf3de90c86e1308823c2008453f1.jfif" width="120" alt="">
        </div>
    </body>

相关推荐