ฉันต้องการแสดงย่อหน้าจากฐานข้อมูลลงในเซลล์ตาราง
ผลลัพธ์คือ 1 บรรทัดขนาดใหญ่โดยไม่สนใจว่าจะจัดระเบียบอย่างไรในฐานข้อมูล ตัวอย่างเช่นละเว้น 'Enter' (บรรทัดใหม่)
ฉันต้องการแสดงให้ตรงตามวิธีการเขียนในฐานข้อมูล
ตัวอย่างเช่นหากมีการบันทึกย่อหน้าดังนี้:
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"สิ่งนี้จะช่วยแก้ปัญหาของบรรทัดใหม่ pre tag จะเพิ่ม 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 }ฉันเพิ่มเฉพาะ<br>ภายใน<td>และทำงานได้ดีทำลายเส้น!
หากคุณมีตัวแปรสตริง\nที่คุณต้องการใส่เข้าไปtdคุณสามารถลองได้
<td>
{value
.split('\n')
.map((s, index) => (
<React.Fragment key={index}>
{s}
<br />
</React.Fragment>
))}
</td>
white-spaceเป็นคุณสมบัติ CSS 2.1 ที่รองรับอย่างกว้างขวาง ทดสอบกับ IE8 ใช้งานได้ดี