JSFiddle - React, Tailwind, and code Playground
HTML
<p class="poem"><em>This is the <b>first</b> verse.<br />
This is the <u>second</u> verse and is very very long.<br />
This is the <s>third</s> verse.</em></p>
<p>Decrease the size of the window to break the verses.</p>
JavaScript
/*
Posibilita un control ortotipográfico cuando el verso
[excede el tamaño de la caja.
Hasta el final existen las siquientes opciones:
1. poetry.clase
Indica los elementos HTML que empleará el script.
Por defecto no tiene clase y toma los elementos <p>.
2. poetry.claseVerso
Indica la clase que se ha de agregar a cada verso
de manera automática. Por defecto es "py-v".
3. poetry.clasePalabra
Indica la clase que se ha de agregar a cada palabra
de manera automática. Por defecto es "py-w".
4. poetry.claseCorte
Indica la clase que se ha de agregar a cada verso
cortado de manera automática. Por defecto es "py-b".
5. poetry.claseContenido
Indica la clase que se ha de agregar a cada contenido
inicial de manera automática. Por defecto es "py-c".
6. poetry.contenidoInicial
Indica el contenido que se ha de agregar antes del
corte de cada verso. Por defecto es "[".
7. poetry.estilo
Indica el estilo que se ha de agegar a cada verso
cortado. Por defecto es alineado a la derecha.
En la estructura HTML un párrafo equivale a una estrofa
y cada verso se divide con un salto. Por ejemplo:
Este es un primer verso.
Este es un segundo verso de la primera estrofa.
Este es un tercer verso.
Se estructura así:
<p>Este es un primer verso.<br />
Este es un segundo verso de la primera estrofa.<br />
Este es un tercer verso.</p>
Se pueden colocar clases e identificadores y otros
elementos HTML, incluso que abarquen toda la
etiqueta <p>, por ejemplo:
<p class="poema"><em>Este es un <b>primer</b> verso.<br />
Este es un <u>segundo</u> verso de la primera estrofa.<br />
Este es un <s>tercer</s> verso.</em></p>
Con esto el resultado obtenido por defecto es:
Este es un primer verso.
Este es un segundo verso
[de la primera estrofa.
Este es un tercer verso.
E incluso puede generar varias líneas cortadas:
Este es un primer
[verso.
Este es un...