Saya ingin menampilkan paragraf dari database ke dalam sel tabel.
Hasilnya adalah 1 baris besar, mengabaikan bagaimana pengaturannya dalam database. mengabaikan 'masuk' misalnya (baris baru)
Saya ingin menunjukkannya persis seperti yang tertulis di database.
Misalnya jika paragraf disimpan seperti ini:
hello ,
my name is x.Saya ingin itu ditampilkan persis seperti itu, alih-alih:
hello, myname is x.Jawaban:
Anda ingin menggunakan CSS yang white-space:prediterapkan sesuai <td>. Untuk melakukan ini ke semua sel tabel, misalnya:
td { white-space:pre }Alternatifnya, jika Anda dapat mengubah markup Anda, Anda dapat menggunakan <pre>tag di sekitar konten Anda. Secara default, browser web menggunakan lembar gaya agen pengguna mereka untuk menerapkan white-space:preaturan yang sama ke elemen ini.
Elemen PRE memberi tahu agen pengguna visual bahwa teks yang dilampirkan telah "diformat sebelumnya". Saat menangani teks yang diformat sebelumnya, agen pengguna visual:
- Dapat membiarkan ruang putih tetap utuh.
- Dapat merender teks dengan font nada tetap.
- Dapat menonaktifkan bungkus kata otomatis.
- Tidak boleh menonaktifkan pemrosesan dua arah.
white-space: pre;diabaikan saat diterapkan di <td>tag. Menggunakan <pre></pre>untuk membungkus konten kami berfungsi dengan baik, tetapi karena penggunaan tabel ini (mengekspor ke excel), #s besar kolom dan baris membengkak ukuran file yang diekspor dan menyebabkan excel macet saat membaca file. (aneh, saya tahu). Apakah ada orang lain yang melihat ini atau punya ide untuk solusi?
style="white-space:pre-wrap; word-wrap:break-word"Ini akan menyelesaikan masalah jalur baru. tag awal akan menambahkan CSS tambahan dari yang dibutuhkan.
<pre>tag tidak segala macam hal di luar hanya memungkinkan karakter baris baru, tapi pengaturan gaya ini memecahkan hanya masalah disajikan.
Bungkus konten dalam <pre>tag (teks yang telah diformat sebelumnya)
<pre>hello ,
my name is x.</pre>Dua saran untuk memecahkan masalah ini:
SOLUSI 1: <div style="white-space:pre;">{database text}</div>atau<pre>{database text}</pre>
Ini adalah solusi yang bagus jika teks Anda tidak memiliki tag html atau properti css. Juga memungkinkan untuk memelihara tab misalnya.
SOLUSI 2: Ganti \ndengan<p></p> or <br/>
Ini adalah solusi jika Anda hanya ingin menambahkan garis putus-putus, tanpa kehilangan properti teks atau pemformatan lainnya. Contoh di php adalah$text = str_replace("\n","<br />",$database_text);
Anda juga dapat menggunakan <p></p>atau <div></div>, tetapi ini membutuhkan lebih banyak penguraian teks.
Pada kode sisi server Anda, ganti baris baru ( \n) dengan <br/>.
Jika Anda menggunakan PHP, Anda dapat menggunakan nl2br()
Hai, saya perlu melakukan hal yang sama! Jangan tanya mengapa tapi saya menghasilkan html menggunakan python dan membutuhkan cara untuk mengulang item dalam daftar dan memiliki setiap item mengambil barisnya sendiri DI DALAM SEL TUNGGAL tabel.
Saya menemukan bahwa br tag bekerja dengan baik untuk saya. Sebagai contoh:
<!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>Ini akan menghasilkan keluaran yang saya inginkan.
Saya menggunakan tag kode html setelah setiap baris (lihat di bawah) dan berfungsi untuk saya.
George Benson </br>
123 Main Street </br>
New York, Ny 12344 </br>
kode di bawah ini bekerja seperti sihir bagi saya >>
td { white-space:pre-line }Jika Anda memiliki variabel string \ndi dalamnya, yang ingin Anda masukkan ke dalamnya td, Anda dapat mencobanya
<td>
{value
.split('\n')
.map((s, index) => (
<React.Fragment key={index}>
{s}
<br />
</React.Fragment>
))}
</td>
white-spaceadalah properti CSS 2.1 yang didukung secara luas. Diuji di IE8, berfungsi dengan baik.