반응형
pre : HTML에서 미리 서식이 지정된 텍스트를 정의하는 태그로 공백이나 줄바꿈을 유지해야하는 코드나 텍스트를 표시할 때 주로 사용된다.
사용방법은 두 가지가 있는데요.
1. HTML 태그 사용
<pre>
띄어쓰기가 들어간 텍스트
</pre>
2. CSS 스타일 적용
<style>
.calss{
white-space: pre-wrap;
}
</style>
pre-wrap : CSS에서 사용되는 속성 중 하나로, 텍스트의 줄바꿈과 공백을 유지하는 기능을 가진다.
저렇게 사용할 수도 있고
<span class="" style="white-space: pre-wrap;"></span>
도 가능하다.
이렇게 하면 DB에서 가져온 띄어쓰기가 적용된 텍스트를 가져올 수 있다.
- <br>을 입혀서 가져올 수 있지만, 해킹 방지로 특수기호를 텍스트로 바꾸는 필터를 거친다면 태그를 사용할 수 없게 되므로 저렇게 사용해도 되고, 아니면 다시 필터를 해서 특수 부분만 적용되게 할 수도 있다.
그건 개발자가 알아서 잘 활용하면 된다.
300x250
'Programming_Language > JavaScript' 카테고리의 다른 글
[JavaScript] DOMContentLoaded, onload 차이점. DOM(Document Object Model) 트리란? (2) | 2024.02.05 |
---|---|
[Event] 반응형 - 페이지 이동 및 화면 크기 변경으로 load, resize 이벤트 화면 크기 변경해보자!! (0) | 2024.01.17 |
[JavaScript] TextArea 작성 및 유효성(특수기호) 검사, 복사 붙이기 (0) | 2024.01.12 |
[JavaScript] 뒤로가기 문제 해결은 이것! OnpageShow (0) | 2024.01.09 |
[JQuery] 모달 팝업 동작 시 부모창 스크롤 동작 못하게 하기 (0) | 2024.01.09 |