`\ n`을 사용하여 HTML에서 줄 바꿈

`\ n`을 사용하여 HTML에서 줄 바꿈

---

매우 멍청한 질문을하는 것처럼 느낍니다) HTML이 \n줄 바꿈을 올바르게 처리하도록하는 방법 이 있습니까? 또는 나는 그것들을 대체해야 <br/>합니까?

https://jsfiddle.net/zawyatzt/

---

이것은 html로 줄 바꿈을 표시하고 캐리지를 반환하는 것이므로 명시 적으로 할 필요는 없습니다. 공백 속성 프리 라인 값을 설정하여 CSS에서 수행 할 수 있습니다.

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

---

에 CSS white-space속성을 사용할 수 있습니다 \n. 에서와 같이 탭을 보존 할 수도 있습니다 \t.

줄 바꿈의 경우 \n:

white-space: pre-line;

줄 바꿈 \n및 탭 \t:

white-space: pre-wrap;

document.getElementById('just-line-break').innerHTML = 'Testing 1\nTesting 2\n\tNo tab';

document.getElementById('line-break-and-tab').innerHTML = 'Testing 1\nTesting 2\n\tWith tab';

#just-line-break {
  white-space: pre-line;
}

#line-break-and-tab {
  white-space: pre-wrap;
}

<div id="just-line-break"></div>

<br/>

<div id="line-break-and-tab"></div>

---

귀하의 질문에 따라 다양한 방법으로 수행 할 수 있습니다.-예를 들어 다음을 사용할 수 있습니다.

텍스트 영역에 새 줄을 삽입하려면 다음을 시도하십시오.


줄 바꿈 및 
캐리지 리턴

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

미리 <pre>---</pre>서식이 지정된 텍스트를 사용할 수도 있습니다 .

<pre>
     This is Line1
     This is Line2
     This is Line3
</pre>

또는 <p>----</p>단락 을 사용할 수 있습니다

<p>This is Line1</p>

<p>This is Line2</p>

<p>This is Line3</p>

참고 : 사용 \n하려면 서버 측 언어를 지원하기 위해 Xampp 또는 Apache와 같은 서버를 설치해야합니다.

---

당신은 <pre>태그 를 사용할 수 있습니다 :

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

---

<pre>태그를 사용할 수 있습니다

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

---

라인 브레이크를로 교체하는 것을 고려해야합니다 <br/>. HTML에서 줄 바꿈은 코드의 줄 바꿈만을 의미합니다.

또는 단락에 줄을 배치하는 것과 같은 다른 HTML 마크 업을 사용할 수 있습니다.

<p>Sample line</p>
<p>Another line</p>

또는 다른 래퍼는 예를 들어 좋아하는 <div>sample</div>CSS 속성을 가진 : display: block.

을 사용할 수도 있습니다 <pre>. 의 콘텐츠는 preHTML 스타일을 무시합니다. 즉, 정상적인 \n브레이크 라인이있는 순수한 html을 표시합니다.

---

간단하고 선형 적 :

 <p> my phrase is this..<br>
 the other line is this<br>
 the end is this other phrase..
 </p>

---

Using white-space: pre-line allows you to input the text directly in the HTML with line breaks without having to use \n

If you use the innerText property of the element via JavaScript on a non-pre element e.g. a <div>, the \n values will be replaced with <br> in the DOM by default

• innerText: replaces \n with <br>
• innerHTML, textContent: require the use of styling white-space

It depends on how your applying the text, but there are a number of options

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

참고URL : https://stackoverflow.com/questions/39325414/line-break-in-html-with-n