Hướng dẫn html ignoring newline - html bỏ qua dòng mới

Question

Có cách nào để làm cho HTML điều trị đúng cách

<span style="white-space: pre-line">@Model.CommentText</span>

2 không? Hoặc tôi phải thay thế chúng bằng

<span style="white-space: pre-line">@Model.CommentText</span>

3?

<div class="text">
  abc
  def
  ghi
</div>

Penny Liu

13.1k5 Huy hiệu vàng71 Huy hiệu bạc89 Huy hiệu đồng5 gold badges71 silver badges89 bronze badges

Hỏi ngày 5 tháng 9 năm 2016 lúc 7:08Sep 5, 2016 at 7:08

0

Điều này là để hiển thị đường mới và vận chuyển trở lại trong HTML, sau đó bạn không cần phải làm điều đó một cách rõ ràng. Bạn có thể làm điều đó trong CSS bằng cách đặt giá trị trước thuộc tính không gian trắng.

<span style="white-space: pre-line">@Model.CommentText</span>

bad_coder

9.81720 Huy hiệu vàng39 Huy hiệu bạc63 Huy hiệu Đồng20 gold badges39 silver badges63 bronze badges

Đã trả lời ngày 5 tháng 9 năm 2016 lúc 7:13Sep 5, 2016 at 7:13

Khakishoiabkhakishoiabkhakishoiab

8.4332 Huy hiệu vàng15 Huy hiệu bạc22 Huy hiệu đồng2 gold badges15 silver badges22 bronze badges

1

Bạn có thể sử dụng thuộc tính CSS

<span style="white-space: pre-line">@Model.CommentText</span>

4 cho

<span style="white-space: pre-line">@Model.CommentText</span>

2. Bạn cũng có thể bảo tồn các tab như trong

<span style="white-space: pre-line">@Model.CommentText</span>

6.

Đối với ngắt dòng

<span style="white-space: pre-line">@Model.CommentText</span>

2:

white-space: pre-line;

Đối với ngắt dòng

<span style="white-space: pre-line">@Model.CommentText</span>

2 và tab

<span style="white-space: pre-line">@Model.CommentText</span>

6:

white-space: pre-wrap;

Đã trả lời ngày 18 tháng 7 năm 2017 lúc 23:14Jul 18, 2017 at 23:14

DarlessondarlesssonDarlesson

5.1222 Huy hiệu vàng20 Huy hiệu bạc25 Huy hiệu Đồng2 gold badges20 silver badges25 bronze badges

1

Theo câu hỏi của bạn, nó có thể được thực hiện bằng nhiều cách khác nhau.

Ví dụ: nếu bạn muốn chèn một dòng mới vào khu vực văn bản, bạn có thể sử dụng những thứ này:

white-space: pre-line;

0 Line Feed và

white-space: pre-line;

1 Trở về vận chuyển, được sử dụng như thế này:

<textarea>Hello &#10;&#13;Stackoverflow</textarea>

Bạn cũng có thể sử dụng văn bản được định dạng trước như thế này:

<pre>
  This is line 1
  This is line 2
  This is line 3
</pre>

Hoặc bạn có thể sử dụng thẻ đoạn

white-space: pre-line;

3 như thế này:

  
<p>This is line 1</p>
<p>This is line 2</p>
<p>This is line 3</p>

Maxshuty

8.33311 Huy hiệu vàng57 Huy hiệu bạc72 Huy hiệu đồng11 gold badges57 silver badges72 bronze badges

Đã trả lời ngày 5 tháng 9 năm 2016 lúc 7:43Sep 5, 2016 at 7:43

SampadsampadSampad

1.46310 Huy hiệu bạc14 Huy hiệu đồng10 silver badges14 bronze badges

2

Bạn có thể sử dụng thẻ

white-space: pre-line;

4

<div class="text">
<pre>
  abc
  def
  ghi
</pre>
  abc
  def
  ghi
</div>

Đã trả lời ngày 5 tháng 9 năm 2016 lúc 7:11Sep 5, 2016 at 7:11

0

Sử dụng

white-space: pre-line;

5 cho phép bạn nhập văn bản trực tiếp vào HTML với các lần ngắt dòng mà không phải sử dụng

<span style="white-space: pre-line">@Model.CommentText</span>

2

Nếu bạn sử dụng thuộc tính

white-space: pre-line;

7 của phần tử thông qua JavaScript trên phần tử không phải PRE, ví dụ: A

white-space: pre-line;

8, các giá trị

<span style="white-space: pre-line">@Model.CommentText</span>

2 sẽ được thay thế bằng

white-space: pre-wrap;

0 trong DOM theo mặc định
white-space: pre-line;
7 property of the element via JavaScript on a non-pre element e.g. a

white-space: pre-line;

8, the

<span style="white-space: pre-line">@Model.CommentText</span>

2 values will be replaced with

white-space: pre-wrap;

0 in the DOM by default

white-space: pre-line;

7: Thay thế

<span style="white-space: pre-line">@Model.CommentText</span>

2 bằng

white-space: pre-wrap;

0

white-space: pre-wrap;

4,

white-space: pre-wrap;

5: Yêu cầu sử dụng kiểu dáng

<span style="white-space: pre-line">@Model.CommentText</span>

4

Nó phụ thuộc vào cách bạn áp dụng văn bản, nhưng có một số tùy chọn

const node = document.createElement('div');
node.innerText = '\n Test \n One '

Đã trả lời ngày 13 tháng 12 năm 2018 lúc 9:29Dec 13, 2018 at 9:29

DrenaidrenaiDrenai

10.3k8 Huy hiệu vàng43 Huy hiệu bạc78 Huy hiệu đồng8 gold badges43 silver badges78 bronze badges

2

Bạn có thể sử dụng thẻ

white-space: pre-line;

4:

<div class="text">
<pre>
abc
def
ghi
</pre>
</div>

Đã trả lời ngày 5 tháng 9 năm 2016 lúc 7:12Sep 5, 2016 at 7:12

EhsanehsanEhsan

12.4K3 Huy hiệu vàng24 Huy hiệu bạc43 Huy hiệu đồng3 gold badges24 silver badges43 bronze badges

0

Đơn giản và tuyến tính:

<span style="white-space: pre-line">@Model.CommentText</span>

0

Đã trả lời ngày 29 tháng 8 năm 2018 lúc 17:23Aug 29, 2018 at 17:23

Alessandro Ornanoalessandro OrnanoAlessandro Ornano

34K11 Huy hiệu vàng100 Huy hiệu bạc131 Huy hiệu Đồng11 gold badges100 silver badges131 bronze badges

2

Một giải pháp đơn giản và tự nhiên hơn không liên quan đến các kiểu CSS hoặc tham chiếu ký tự số như

white-space: pre-wrap;

8 sẽ là sử dụng tham chiếu thực thể ký tự

white-space: pre-wrap;

9:

<span style="white-space: pre-line">@Model.CommentText</span>

1

Lưu ý: Vì điều này được xác định đơn giản là ký tự LF (nguồn cấp dữ liệu hoặc điểm

<textarea>Hello &#10;&#13;Stackoverflow</textarea>

0 unicode Point), nên có thể gây tranh cãi về việc nó có phù hợp với các kịch bản trong đó toàn bộ trình tự CR + LF (Trở lại vận chuyển +) không. Nhưng sau đó, nó đã hoạt động trong các thử nghiệm Chrome, Edge và WebView2 của tôi được thực hiện trong Windows 10, vì vậy nó phải an toàn khi sử dụng.: Since this is defined simply as the LF (line feed, or the

<textarea>Hello &#10;&#13;Stackoverflow</textarea>

0 Unicode code point) character, it can be debatable whether it suits scenarios where the entire CR + LF (carriage return + line feed) sequence is required. But then, it worked in my Chrome, Edge and WebView2 tests done in Windows 10, so it should be safe to use.

Đã trả lời ngày 14 tháng 5 lúc 15:59May 14 at 15:59

Yin Cognytoyin CognytoYin Cognyto

8761 Huy hiệu vàng9 Huy hiệu bạc21 Huy hiệu đồng1 gold badge9 silver badges21 bronze badges

1