Supongamos que quiero decorar enlaces a ciertos tipos de archivos usando una imagen. Podría declarar mis enlaces como
<a href='foo.pdf' class='pdflink'>A File!</a>
entonces tener CSS como
.pdflink:after { content: url('/images/pdf.png') }
Ahora, esto funciona muy bien, excepto si pdf.png
no es el tamaño correcto para mi texto de enlace.
Me gustaría poder decirle al navegador que escale la :after
imagen, pero por mi vida no puedo encontrar la sintaxis correcta. ¿O es esto como imágenes de fondo, donde el cambio de tamaño simplemente no es posible?
ETA: Me estoy inclinando hacia a) cambiar el tamaño de la imagen de origen para que sea del tamaño "correcto", del lado del servidor y / o b) cambiar el marcado para simplemente proporcionar una etiqueta IMG en línea. Estaba tratando de evitar ambas cosas, pero parece que serán más compatibles que intentar hacer cosas puramente con CSS. La respuesta a mi pregunta original parece ser "se puede clasificar de hacerlo, a veces".