0

Quiero poner un máximo de caracteres a un titulo, y cuando ya llegue a ese máximo muestre los 3 puntos que indican que el texto sigue, este es mi codigo:

.title {
font: bold 22px Roboto, sans-serif;
float: left;
margin: 0 0 8px 2px;
2
  • ¿Podrías indicarnos qué has intentado? El código solo es una clase en CSS sin cerrar. Commented el 7 sept. 2018 a las 6:43
  • Creo que no puedes limitar por el número de caracteres sino que debe ser por tamaño, al igual que te explican en la respuesta de J.Correa Commented el 7 sept. 2018 a las 7:21

2 respuestas 2

3

Usa propiedades de CSS

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <style type="text/css">
    .ellipsis {
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
     }
    .short { width: 50px; }
  </style>
</head>
<body>
  <div class="short">
    <p class="ellipsis">Esto es una cadena muy larga</p>
  </div>
</body>
</html>

0

Usando JavaScript, con .replace()

[...document.getElementsByClassName("title")].forEach(function(e){

e.innerHTML = e.innerHTML.replace(/(.{1,5})(.*)/g, "$1...");

})
<h1 class="title">Titulo muyyy largo</h1>

Tu Respuesta

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

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