Я хочу показати абзац з бази даних у комірку таблиці.
Результат - великий 1 рядок, ігноруючи, як його організовано в базі даних. наприклад, ігнорування "входить" (нові рядки)
Я хочу показати це саме відповідно до того, як це записано в базі даних.
Наприклад, якщо абзац збережено так:
hello ,
my name is x.Я хочу, щоб це було показано саме так, а не:
hello, myname is x.Відповіді:
Ви хочете використовувати CSS, white-space:preзастосований до відповідного <td>. Для цього потрібно зробити всі клітини таблиці, наприклад:
td { white-space:pre }Якщо ви можете змінити розмітку, ви можете використовувати <pre>тег навколо свого вмісту. Веб-браузери за замовчуванням використовують їх таблицю стилів-агентів користувачів, щоб застосувати те саме white-space:preправило до цього елемента.
Елемент PRE повідомляє візуальним агентам користувача, що доданий текст "попередньо відформатований". Під час обробки заздалегідь відформатованого тексту, візуальні користувацькі агенти:
- Може залишити білий простір неушкодженим.
- Може відображати текст шрифтом із фіксованим кроком.
- Може відключити автоматичне обгортання слів.
- Не повинно вимикати двосторонню обробку.
white-space: pre;ігнорується при застосуванні до <td>тегу. Використання <pre></pre>для обгортання нашого вмісту працює чудово, але завдяки використанню цієї таблиці (експорт до excel) великі # стовпчиків та рядків на повітряній кулі розміром експортованого файлу і спричиняють збій excel при прочитанні файлу. (дивно, я знаю). Хтось ще бачив це чи має ідею рішення?
style="white-space:pre-wrap; word-wrap:break-word"Це вирішило б питання про нову лінію. попередній тег додасть додатковий CSS, ніж потрібно.
<pre>Тег робить всі види речей за раз , дозволяючи символи нового рядка, але ці настройки стилю тільки вирішити проблему представили.
Оберніть вміст у <pre>тег (заздалегідь відформатований текст)
<pre>hello ,
my name is x.</pre>Дві пропозиції щодо вирішення цієї проблеми:
РІШЕННЯ 1: <div style="white-space:pre;">{database text}</div>або<pre>{database text}</pre>
Це гарне рішення, якщо ваш текст не має тегів HTML або css властивостей. Також дозволяє підтримувати вкладки, наприклад.
РІШЕННЯ 2: Замініть \nна<p></p> or <br/>
Це рішення, якщо ви хочете просто додати розриви, не втрачаючи інших властивостей тексту чи форматування. Прикладом в php може бути$text = str_replace("\n","<br />",$database_text);
Ви також можете використовувати <p></p>або <div></div>, але для цього потрібно трохи більше розбору тексту.
На коді на сервері замініть нові рядки ( \n) на <br/>.
Якщо ви використовуєте PHP, ви можете використовувати nl2br()
Привіт, мені потрібно було зробити те саме! Не запитуйте, чому, але я генерував html за допомогою python і мені потрібен спосіб прокрутити елементи в списку і дозволити кожному елементу взяти рядок самостійно ВІД ОДНОГО КЛІТКА таблиці.
Я виявив, що тег br працює на мене добре. Наприклад:
<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
<TABLE>
<TR>
<TD>
item 1 <BR>
item 2 <BR>
item 3 <BR>
item 4 <BR>
</TD>
</TR>
</TABLE>
</BODY>Це дасть результат, який я хотів.
Я використовую тег коду html після кожного рядка (див. Нижче), і він працює для мене.
George Benson </br>
123 Main Street </br>
New York, Ny 12344 </br>
наведений нижче код працює як магія для мене >>
td { white-space:pre-line }Якщо у вас є змінна струна \n, яку ви хочете помістити всередину td, ви можете спробувати
<td>
{value
.split('\n')
.map((s, index) => (
<React.Fragment key={index}>
{s}
<br />
</React.Fragment>
))}
</td>
white-space- це властивість CSS 2.1, яка широко підтримується. Тестований на IE8, чудово працює.