Skip to main content
Corrección gramatical y formateo de sintaxis
Origen Enlace
David E. Luna M.
  • 2.9k
  • 4
  • 14
  • 30

estoyEstoy haciendo una página en HTML para albergar varios cuentos, pero me gustaría que al pasar el texto a la página se pusiera un espacio a la izquierda cada vez que se encuentre con el símbolo "–", que es el símbolo de los diálogos entre los personajes, esto. Esto lo pienso con el objetivo de que la lectura sea más clara.

Me gustaría que al final se vería así, pero solo consigo que se vea todo justificado,solo me falta esoMe gustaría que al final se vería así, pero solo consigo que se vea todo justificado, solo me falta eso

Adjunto mi código en HTML:

.cuento p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
<!DOCTYPE html>
<html> 

<head>
    <title>Cuento</title>
</head> 

<body>
    <div class="cuento">
    <p>Érase una vez una preciosa niña que siempre llevaba una capa roja con capucha para protegerse del frío. Por eso, todo el mundo la llamaba Caperucita Roja.</p>
    <p>Caperucita vivía en una casita cerca del bosque. Un día, la mamá de  Caperucita le dijo:</p>
    <p>– Hija mía, tu abuelita está enferma. He preparado una cestita con tortas y un tarrito de miel para que se la lleves ¡Ya verás qué contenta se pone!</p>
    <p> </p>
    <p>– ¡Estupendo, mamá! Yo también tengo muchas ganas de ir a visitarla – dijo Caperucita saltando de alegría.</p>
    <p>Cuando Caperucita se disponía  a salir de casa, su mamá, con gesto un poco serio, le hizo una advertencia:</p>
    <p>– Ten mucho cuidado, cariño. No te entretengas con nada y no hables con extraños. Sabes que en el bosque vive el lobo y es muy peligroso. Si ves que aparece, sigue tu camino sin detenerte.</p>
    <p>– No te preocupes, mamita – dijo la niña- Tendré en cuenta todo lo que me dices.</p>
    <p>– Está bien – contestó la mamá, confiada – Dame un besito y no tardes en regresar.</p>
    <p>– Así lo haré, mamá – afirmó de nuevo Caperucita diciendo adiós con su manita mientras se alejaba.</p>
    <p>Cuando llegó al bosque, la pequeña comenzó a distraerse contemplando los pajaritos y recogiendo flores. No se dio cuenta de que alguien la observaba detrás de un viejo y frondoso árbol. De repente, oyó una voz dulce y zalamera.</p>
    <p>– ¿A dónde vas, Caperucita?</p>
 
    </div>
 
</body> 

</html>

He visto problemas similares al mío y he tratado de resolverlo, pero mejor no adjunto nada, puesto que no pude resolverlo. De antemano gracias.

estoy haciendo una página en HTML para albergar varios cuentos pero me gustaría que al pasar el texto a la página se pusiera un espacio a la izquierda cada vez que se encuentre con el símbolo "–" que es el símbolo de los diálogos entre los personajes, esto lo pienso con el objetivo de que la lectura sea más clara.

Me gustaría que al final se vería así, pero solo consigo que se vea todo justificado,solo me falta eso

Adjunto mi código en HTML

.cuento p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
<!DOCTYPE html>
<html>
<head>
    <title>Cuento</title>
</head>
<body>
    <div class="cuento">
    <p>Érase una vez una preciosa niña que siempre llevaba una capa roja con capucha para protegerse del frío. Por eso, todo el mundo la llamaba Caperucita Roja.</p>
<p>Caperucita vivía en una casita cerca del bosque. Un día, la mamá de  Caperucita le dijo:</p>
<p>– Hija mía, tu abuelita está enferma. He preparado una cestita con tortas y un tarrito de miel para que se la lleves ¡Ya verás qué contenta se pone!</p>
<p> </p>
<p>– ¡Estupendo, mamá! Yo también tengo muchas ganas de ir a visitarla – dijo Caperucita saltando de alegría.</p>
<p>Cuando Caperucita se disponía  a salir de casa, su mamá, con gesto un poco serio, le hizo una advertencia:</p>
<p>– Ten mucho cuidado, cariño. No te entretengas con nada y no hables con extraños. Sabes que en el bosque vive el lobo y es muy peligroso. Si ves que aparece, sigue tu camino sin detenerte.</p>
<p>– No te preocupes, mamita – dijo la niña- Tendré en cuenta todo lo que me dices.</p>
<p>– Está bien – contestó la mamá, confiada – Dame un besito y no tardes en regresar.</p>
<p>– Así lo haré, mamá – afirmó de nuevo Caperucita diciendo adiós con su manita mientras se alejaba.</p>
<p>Cuando llegó al bosque, la pequeña comenzó a distraerse contemplando los pajaritos y recogiendo flores. No se dio cuenta de que alguien la observaba detrás de un viejo y frondoso árbol. De repente, oyó una voz dulce y zalamera.</p>
<p>– ¿A dónde vas, Caperucita?</p>
 
    </div>
 
</body>
</html>

He visto problemas similares al mío y he tratado de resolverlo pero mejor no adjunto nada puesto que no pude resolverlo. De antemano gracias.

Estoy haciendo una página en HTML para albergar varios cuentos, pero me gustaría que al pasar el texto a la página se pusiera un espacio a la izquierda cada vez que se encuentre con el símbolo "–", que es el símbolo de los diálogos entre los personajes. Esto lo pienso con el objetivo de que la lectura sea más clara.

Me gustaría que al final se vería así, pero solo consigo que se vea todo justificado, solo me falta eso

Adjunto mi código en HTML:

.cuento p {
  display: block;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
<!DOCTYPE html>
<html> 

<head>
  <title>Cuento</title>
</head> 

<body>
  <div class="cuento">
    <p>Érase una vez una preciosa niña que siempre llevaba una capa roja con capucha para protegerse del frío. Por eso, todo el mundo la llamaba Caperucita Roja.</p>
    <p>Caperucita vivía en una casita cerca del bosque. Un día, la mamá de Caperucita le dijo:</p>
    <p>– Hija mía, tu abuelita está enferma. He preparado una cestita con tortas y un tarrito de miel para que se la lleves ¡Ya verás qué contenta se pone!</p>
    <p> </p>
    <p>– ¡Estupendo, mamá! Yo también tengo muchas ganas de ir a visitarla – dijo Caperucita saltando de alegría.</p>
    <p>Cuando Caperucita se disponía a salir de casa, su mamá, con gesto un poco serio, le hizo una advertencia:</p>
    <p>– Ten mucho cuidado, cariño. No te entretengas con nada y no hables con extraños. Sabes que en el bosque vive el lobo y es muy peligroso. Si ves que aparece, sigue tu camino sin detenerte.</p>
    <p>– No te preocupes, mamita – dijo la niña- Tendré en cuenta todo lo que me dices.</p>
    <p>– Está bien – contestó la mamá, confiada – Dame un besito y no tardes en regresar.</p>
    <p>– Así lo haré, mamá – afirmó de nuevo Caperucita diciendo adiós con su manita mientras se alejaba.</p>
    <p>Cuando llegó al bosque, la pequeña comenzó a distraerse contemplando los pajaritos y recogiendo flores. No se dio cuenta de que alguien la observaba detrás de un viejo y frondoso árbol. De repente, oyó una voz dulce y zalamera.</p>
    <p>– ¿A dónde vas, Caperucita?</p>
  </div>
</body> 

</html>

He visto problemas similares al mío y he tratado de resolverlo, pero mejor no adjunto nada, puesto que no pude resolverlo. De antemano gracias.

etiquetas editadas
Enlace
user128299
user128299
Origen Enlace
Nathan
  • 51
  • 1
  • 5

¿Cómo poner un espacio cada vez que encuentre el símbolo "– " en un texto?

estoy haciendo una página en HTML para albergar varios cuentos pero me gustaría que al pasar el texto a la página se pusiera un espacio a la izquierda cada vez que se encuentre con el símbolo "–" que es el símbolo de los diálogos entre los personajes, esto lo pienso con el objetivo de que la lectura sea más clara.

Me gustaría que al final se vería así, pero solo consigo que se vea todo justificado,solo me falta eso

Adjunto mi código en HTML

.cuento p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
<!DOCTYPE html>
<html>
<head>
    <title>Cuento</title>
</head>
<body>
    <div class="cuento">
    <p>Érase una vez una preciosa niña que siempre llevaba una capa roja con capucha para protegerse del frío. Por eso, todo el mundo la llamaba Caperucita Roja.</p>
<p>Caperucita vivía en una casita cerca del bosque. Un día, la mamá de  Caperucita le dijo:</p>
<p>– Hija mía, tu abuelita está enferma. He preparado una cestita con tortas y un tarrito de miel para que se la lleves ¡Ya verás qué contenta se pone!</p>
<p> </p>
<p>– ¡Estupendo, mamá! Yo también tengo muchas ganas de ir a visitarla – dijo Caperucita saltando de alegría.</p>
<p>Cuando Caperucita se disponía  a salir de casa, su mamá, con gesto un poco serio, le hizo una advertencia:</p>
<p>– Ten mucho cuidado, cariño. No te entretengas con nada y no hables con extraños. Sabes que en el bosque vive el lobo y es muy peligroso. Si ves que aparece, sigue tu camino sin detenerte.</p>
<p>– No te preocupes, mamita – dijo la niña- Tendré en cuenta todo lo que me dices.</p>
<p>– Está bien – contestó la mamá, confiada – Dame un besito y no tardes en regresar.</p>
<p>– Así lo haré, mamá – afirmó de nuevo Caperucita diciendo adiós con su manita mientras se alejaba.</p>
<p>Cuando llegó al bosque, la pequeña comenzó a distraerse contemplando los pajaritos y recogiendo flores. No se dio cuenta de que alguien la observaba detrás de un viejo y frondoso árbol. De repente, oyó una voz dulce y zalamera.</p>
<p>– ¿A dónde vas, Caperucita?</p>

    </div>

</body>
</html>

He visto problemas similares al mío y he tratado de resolverlo pero mejor no adjunto nada puesto que no pude resolverlo. De antemano gracias.