можно ли достигнуть модификации высоты изображения в CSS Pseudo-Elements (: до/: после)?

. Присваивая класс для ссылок, таких как , CSS может быть использован для отображения изображения после этого:

.pdflink:after { content: url('/images/pdf.png') }

, в то время как этот подход, эффективный подход, эффективно добавляет изображение на изображение, изображение на изображение. Способность масштабировать изображения в псевдо-элементах была давним вопросом в веб-разработке.

традиционный метод изменения размера фоновых изображений не применим к псевдо-элементам. Однако некоторая поддержка изменения размера изображений может быть достигнута с помощью свойства размером с фонового размера:

.pdflink:after {
    background-image: url('/images/pdf.png');
    background-size: 10px 20px;
    display: inline-block;
    width: 10px; 
    height: 20px;
    content:"";
}

Этот подход включает в себя настройку размер фонового размера, в то время как явное определение ширины и высоты окружающего блока. Важно отметить, что совместимость ограничена для этой техники. Таблица совместимости MDN предоставляет дополнительную информацию о поддержке браузера.