相关疑难解决方法(0)

我有一个网站有很多页面和不同的背景图片,我从CSS显示它们:

body.page-8 {
    background: url("../img/pic.jpg") no-repeat scroll center top #000;
    background-size: cover;
}

但是,我想在一个页面上使用<img>元素显示不同的(全屏)图片,并且我希望它们具有与上述background-image: cover;属性相同的 属性(图像不能从CSS显示,它们必须从HTML文档中显示).

通常我使用:

div.mydiv img {
    width: 100%;
}

要么:

div.mydiv img {
    width: auto;
}

使图片充分和响应.然而,width: 100%当屏幕变得太窄时,图片会缩小太多(),并在底部屏幕中显示正文的背景颜色.另一种方法,width: auto;只使图像完整大小,不响应屏幕大小.

有没有办法以同样的方式显示图像background-size: cover？

之前曾问过这个问题,但解决方案并不适用于我的情况.我想确保打印某些背景图像,因为它们是页面的组成部分.(它们不是直接在页面中的图像,因为它们中有几个被用作CSS精灵.)

关于同一个问题的另一个解决方案建议使用list-style-image,只有当每个图标都有不同的图像时才能使用,不能使用CSS精灵.

除了创建一个内联图标的单独页面,还有另一种解决方案吗？