Suponha que eu queira decorar links para certos tipos de arquivo usando uma imagem. Eu poderia declarar meus links como
<a href='foo.pdf' class='pdflink'>A File!</a>
então tem CSS como
.pdflink:after { content: url('/images/pdf.png') }
Agora, isso funciona muito bem, exceto se pdf.png
não for do tamanho certo para o texto do meu link.
Gostaria de poder dizer ao navegador para dimensionar a :after
imagem, mas não consigo encontrar a sintaxe certa. Ou é como imagens de fundo, onde o redimensionamento simplesmente não é possível?
ETA: Estou inclinado a: a) redimensionar a imagem de origem para o tamanho "correto", do lado do servidor e / ou b) alterar a marcação para simplesmente fornecer uma tag IMG em linha. Eu estava tentando evitar essas duas coisas, mas elas parecem ser mais compatíveis do que tentar fazer coisas puramente com CSS. A resposta à minha pergunta inicial parece ser "você pode classificar de fazê-lo, às vezes".