我可以想到的唯一方法是在页面的顶部有一些内联CSS，如下所示：

<style type="text/css">
    @media only screen and (min-width: 680px) {
        .hero-image { background-image: url(../images/image.jpg); }
    }
</style>

首先，我可以在内联CSS中使用媒体查询吗？

第二，这样做可以避免在手机上下载图像吗？

第三，有没有更好的方法？

谢谢