Хорошо известно, что использование max-height и max-width может сделать изображение автоматически подходящим в div, как показано ниже:
.cover img {
max-width: 100%;
max-height: 100%;
}
Есть ли способ сделать полупрозрачную обложку (установив opacity: 0.8
в div), который просто соответствует размеру изображения, не получая ширину и высоту с помощью javascript?
Ниже приводится моя попытка в jsfiddle. Я могу только сделать это, покрывая весь контейнер, но то, что я хочу, - это просто охватить только изображение. Размер изображения является переменным, поскольку он должен быть загружен пользователем. https://jsfiddle.net/muorou0c/1/