Odpowiedzi:
Spójrz na domyślny arkusz stylów W3C CSS2.1 lub wersję roboczą CSS2.2 . Skopiuj wszystkie ustawienia PRE i umieść je we własnej klasie.
pre {
display: block;
unicode-bidi: embed;
font-family: monospace;
white-space: pre;
}
overflow: scroll
? Lub jeśli chcesz tylko przewijać w poziomie overflow-x: scroll
developer.mozilla.org/en-US/docs/Web/CSS/overflow
overflow: auto;
może być lepsze, w przeciwnym razie możesz skończyć z dwoma zestawami pasków przewijania, gdy ich nie potrzebujesz.
Zobacz właściwość CSS z odstępami .
.like-pre { white-space: pre; }
white-space: pre-wrap
przydatne. Zachowuje się jak pre
długie linie, ale zawija.
To sprawia, że SPAN wygląda jak PRE:
span {
white-space: pre;
font-family: monospace;
display: block;
}
Pamiętaj, aby odpowiednio zmienić selektor css.
W szczególności nieruchomość, na którą patrzysz, to:
white-space: pre
http://www.quirksmode.org/css/whitespace.html
http://www.w3.org/TR/CSS21/text.html#white-space-prop
Wypróbuj ten styl
.pre {
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
line-height: 1.5;
word-break: break-all;
white-space: pre;
white-space: pre\9; /* IE7+ */
display: block;
}
Zastosowano to samo tutaj - http://www.makemyshop.in/
Dlaczego nie użyć po prostu tagu <pre> zamiast tagu span? Oba są wbudowane, więc oba powinny zachowywać się tak, jak chcesz. Jeśli masz problem z zastąpieniem całej definicji <pre>, po prostu nadaj jej class / id.