WP主题丨自定义HTML代码仅在电脑端显示

要实现这个功能,你可以使用HTML和CSS来控制图片显示。在HTML中,你可以为图片添加一个类名,例如desktop-only。然后,在CSS中,你可以使用媒体查询(media query)来仅在电脑显示这个图片

解析

  1. 在HTML中为图片添加一个类名,例如desktop-only
  2. 在CSS中使用媒体查询,仅在电脑显示这个图片。

代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        .desktop-only {
            display: none;
        }

        @media screen and (min-width: 768px) {
            .desktop-only {
                display: block;
            }
        }
    </style>
</head>
<body>
    <img src="your-image-source.jpg" alt="Your Image" class="desktop-only">
</body>
</html>

your-image-source.jpg替换为你的图片源文件。这段代码将在电脑端显示图片,而在移动端不显示。

温馨提示: 本文最后更新于2024-04-15 17:02:35,若有错误或已失效,请在下方 留言或联系 站长
有问题及时联系站长,QQ:1240555208
更多优质资源在QQ群里,可以进群领取:467392290~
© 版权声明
THE END
点赞14 分享
及时反馈~ 抢沙发

请登录后发表评论

    暂无评论内容