0

Les cuento mi problema,

Necesito pasar a capitalize un texto que está en mayúsculas, he utilizado la propiedad

.info p{ text-transform: capitalize}

Mi problema es que con las minúsculas que aparecen en el texto funciona perfecto. pero no afecta a las mayúsculas.

o tendré que hacerlo con js?

2
  • Cabe destacar que es por que estás usando mal capitalize. La función de capitalize es transformar el primer carácter de cada palabra a mayúsculas. Si dicha letra ya estaba en mayúsculas, no hará nada. Y tampoco hace contacto alguno con el resto de la palabra. Por eso, y como @Triby lo ha hecho, hay que realmente convertir el texto a minúsculas, antes de capitalizar.
    – Excorpion
    el 21 dic. 2020 a las 20:43
  • Quieres que cada palabra está capitalizada o solo la primer letra del párrafo/contenido? si fuera solo la primer letra de la primer palabra si es viable con CSS el 21 dic. 2020 a las 23:43

1 respuesta 1

1

Efectivamente, a menos que alguien proporcione otra solución, debes usar Javascript:

  1. Obtener todos los párrafos con document.querySelectorAll() especificando la clase a la que pertenecen
  2. Recorrer con forEach() para convertir a minúsculas
  3. La clase CSS se encarga de capitalizar el resultado

// Obtener todos los párrafos dentro de contenedores con clase .info
// Recorrer (forEach)
document.querySelectorAll('.info p').forEach(p => {
  // Convertir a minúsculas
  p.innerHTML = p.innerHTML.toLowerCase()
});
.info p {
  text-transform: capitalize;
}
<div class="info">
  <p>TEXTO A CAPITALIZAR con MAYÚSCULAS y minúsculas.</p>
</div>

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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