1

Quiero aplicar un tipo de letra diferente a una letra en una palabra, lo normal sería poner un span y listo, pero no puedo modificar el HTML. Tengo un div class menu, dentro un div class logo y dentro una etiqueta de ancla donde tiene el texto del logo. A este texto es al que le debo cambiar una letra a otro tipo de fuente.

<div class="menu">
    <div class="logo">
        <a class="m-logo" href="#">Logo.</a>
    </div>
</div>

Por poner un ejemplo, en esa situación debo cambiar la fuente a la segunda letra "o" que esta antes del punto y no puedo modificar el HTML. ¿Es posible realizar esto con puro CSS, sin tocar el HTML?

2

1 respuesta 1

1

las etiquetas HTML solo permiten aplicar un estilo global, puedes usar un degrade multiple "Algo muy complejo para otras soluciones más simples" como el uso de span

<p>
  <span style='color: blue'>L</span>
  <span style='color: red'>o</span>
  <span style='color: black'>g</span>
  <span style='color: blue'>o</span>
  <span style='color: black'>.</span>
</p>

Si realmente estas obsesionado con hacerlo con CSS sin alterar el HTML, puedes usar gradientes lineales, pero debes configurarlo según el tamaño de tu fuente.

.gradient {
  font-size: 66px;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation-timing-function: linear;
  background-image: linear-gradient(to right, red 34px, orange 0%, orange 71px, black 0%, black 107px, green 0%);
}
<p class="gradient">Logo.</p>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.