Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia!
Me deparei com um problema no trabalho hoje de manhã e não consegui solucionar, nem procurando sobre o mesmo.
No editor do meu site às vezes, ao clicar para o texto selecionado ficar em negrito, ao invés de ele inserir o texto entre a tag <b>, ele coloca por css direto na linha com span, usando font-weight, ficando da seguinte forma:
<span style="font-weight: 700;">TEXTO</span>
E no meu arquivo de css tem o seguinte atributo para que os textos em negrito fiquem na cor verde: #box-description > span:first-child > p > b {
color: #4aab25 !important;
}
A minha dúvida é: como posso fazer para que todo texto dentro de um span com font-weight: 700 fique com esse atributo acima igual o que está na tag <b>? Eu tentei das seguintes formas e não deu certo:-
span[style="font-weight: 700"]
-
span[font-weight="700"]
Fico no aguardo de um auxílio de quem puder me ajudar :D
Obrigado.
Somente as em negrito, quero que ao invés de estarem pretas, fiquem verdes. Dê uma olhada na primeira linha da descrição para ter uma noção:
https://www.naturalfitness.com.br/waxy-maize-1kg-new-millen
Imagem: http://prntscr.com/gbofzw
Você pode colocar uma classe com o mesmo nome nos spans, por exemplo:
<span class="span_negrito">TEXTO</span>
No css:
.span_negrito {
font-weight: 700;
color: #4aab25 !important;
}
Todo o span com a classe "span_negrito" vai estar em negrito e com a cor verde.Sim, fazer isso dessa forma seria fácil. A questão é que não é só eu que cadastra produtos, e o resto do pessoal que cadastra não entende de CSS, então se isso acontecer (o CSS estiver inline) irá ficar um padrão diferente das outras descrições de produtos, pois ele terá uma prioridade maior sob o CSS externo.
O que eu gostaria é que quando o font-weight: 700 estiver inline, junto com o span, ele ganhe o atributo da cor verde.
Por exemplo:
Sempre que o elemento span conter o atributo font-weight:700 inline, mudar a cor do texto contido dentro do span para verde.
Encontrei a solução pro problema. Obrigado pela ajuda Luiz! Vou deixar a solução abaixo se alguém tiver a mesma dúvida:
Usei o código da seguinte forma para dar certo:
#box-description > span:first-child > p > [style*="font-weight: 700"] {
color: #4aab25 !important;
}
O problema que eu estava tendo era em colocar o elemento span antes do atributo, da seguinte forma:#box-description > span:first-child > p > span [style*="font-weight: 700"] {
...
}
Ao tirar o elemento span funcionou!
Pode ser que seja necessário também criar outra regra caso no css inline não esteja font-weight: 700. De uma forma mais completa, pode ser usado da seguinte forma como exemplo:
#box-description > span:first-child > p > b,
#box-description > span:first-child > p > [style*="font-weight: 700"],
#box-description > span:first-child > p > [style*="font-weight:700"],
#box-description > span:first-child > p > [style*="bold"],
#box-description > span:first-child > p > [style*="bolder"] {
color: #4aab25 !important;
}
Você quer que apenas as palavras em negrito fiquem verde. É isso? Tem alguma palavra sem estar em negrito que você quer que não fique verde?