code

깨지지 않는 공간 처리 :

codestyles 2020. 11. 25. 08:00
반응형

깨지지 않는 공간 처리 :

 


  줄 바꿈이 발생하지 않는 빈 공간을 나타내는 끊기지 않는 공백입니다.

내가 사용한다면

<p>&nbsp;</p>

두 구절 사이에 공백이 있습니다 (더 큰 휴식). 내가 사용한다면

<p> </p>

두 통로 사이에 새 줄만 있습니다 (끊김 없음). 왜?


HTML에서 일반 공백 문자 만 포함하는 요소는 비어있는 것으로 간주됩니다. 일반 공백 문자 만 포함 된 단락의 높이는 0입니다. 구분되지 않는 공백은 중요하지 않은 것으로 간주되지 않는 특수한 종류의 공백 문자이므로 비어 있지 않은 단락의 내용으로 사용할 수 있습니다.

단락에서 CSS 여백을 고려하더라도 "빈"단락의 높이가 0이므로 세로 여백이 축소 됩니다. 이로 인해 높이와 여백이 없어 마치 전혀 존재하지 않는 것처럼 보입니다.


해결 방법은 어떻습니까? 내 경우에는 내가 jQuery를 변수에 텍스트 영역의 값을했다, 모든 변경 "<p>&nbsp"<p class="clear">다음의 예와 같은 특정 높이와 여유를 가지고 명확 클래스 :

jQuery

tinyMCE.triggerSave();
var val = $('textarea').val();
val = val.replace(/<p>&nbsp/g, '<p class="clear">');

그런 다음 val은 새 val과 함께 데이터베이스에 저장됩니다.

CSS

p.clear{height: 2px; margin-bottom: 3px;}

원하는대로 높이와 여백을 조정할 수 있습니다. 그리고 'p'는 display : block 요소 이기 때문에 . 예상되는 출력을 제공해야합니다.

도움이 되었기를 바랍니다.


문제를 이해하면 작동합니다.

& emsp— 전각 공간; 이것은 매우 넓은 공간이어야하며 일반적으로 4 개의 실제 공간이 있어야합니다. & ensp-en 공간; 이것은 다소 넓은 공간, 대략 두 개의 일반 공간이어야합니다. & thinsp-일반 공간보다 훨씬 더 좁은 좁은 공간입니다.

출처 : http://hea-www.harvard.edu/~fine/Tech/html-sentences.html

참고 URL : https://stackoverflow.com/questions/12279611/handling-of-non-breaking-space-pnbsp-p-vs-pp

반응형