Eu preciso usar o seletor de atributos no css para alterar o link em cores e imagens diferentes, mas não funciona.
Eu tenho este html:
<a href="/manual.pdf">A PDF File</a>
E este css:
a {
display: block;
height: 25px;
padding-left: 25px;
color:#333;
font: bold 15px Tahoma;
text-decoration: none;
}
a[href='.pdf'] { background: red; }
Por que o fundo não é vermelho?
html
css
css-selectors
Igor Kraskynlykov
fonte
fonte
element[attribute_name="attribute_value"]
.Respostas:
Use o $ após seu href. Isso fará com que o valor do atributo corresponda ao final da string.
JSFiddle: http://jsfiddle.net/UG9ud/
fonte: http://www.w3.org/TR/selectors/
fonte
A resposta aceita (usando
a[href$='.pdf']
) pressupõe que um link para um pdf sempre terminará com.pdf
. Esse não é necessariamente o caso, já que o link pode ter uma string de consulta ou um fragmento hash, por exemplo, com um código de rastreamento UTM ou um número de página, caso em que esses links não seriam correspondidos. Na verdade, dependendo do seu aplicativo, esse pode ser o caso para a maioria dos links.Se você quiser garantir que sua regra também seja aplicada nesses casos, você pode corresponder a
.pdf
qualquer lugar no atributo usandoNo entanto, isso corresponderá a algumas coisas improváveis, mas não intencionais, como um subdomínio
our.pdf.domain.com/a-page
. Mas podemos restringi-lo ainda mais, pois sabemos que só o usaríamos para corresponder a PDFs que têm uma string de consulta ou fragmento hash. Se combinarmos os 3 casos, devemos combinar todos os links em PDF.fonte