modificando la altura de la imagen en css pseudo-elements: ¿es posible?

alterando la altura de una imagen contenida dentro de un pseudo-elemento CSS (: antes/: después) puede ser desafiante pero no imposible. Por defecto, cambiar el tamaño de la imagen no se admite directamente con CSS.

Para lograr la escala deseada, considere los siguientes enfoques:

1. Ajuste el tamaño de fondo:

para: después de los pseudo-elementos, ajuste la propiedad de tamaño de fondo. Sin embargo, asegúrese de especificar el ancho y la altura del elemento de bloque que contiene la imagen usando las propiedades de ancho y altura.

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

compatibilidad:

sea consciente de la compatibilidad del navegador al usar este método. Consulte la tabla de compatibilidad integral en MDN para obtener más información.

2. Resumen de la imagen de origen:

Alternativamente, considere cambiar el tamaño de la imagen original al lado del servidor de tamaño apropiado antes de usarla en el CSS. Esto asegura que la imagen se muestre en las dimensiones deseadas sin confiar en la escala del navegador.

3. Etiqueta IMG en línea:

Para un enfoque más directo, incorpore una etiqueta en línea junto con el pseudoelemento CSS. Este enfoque garantiza que la imagen se convertirá en el tamaño especificado, pero se desvía del objetivo inicial de minimizar el marcado.