공백문자란 무엇인가요? 공백 문자: 공백, 탭, 개행 참고: HTML을 구문 분석할 때 브라우저는 모든 공백 문자를 하나의 공백으로 결합합니다. 공백 문자가 HTML 구조에 미치는 영향 올바르게 표시할 수 없습니다 </h3> <p> 잘못된 구조로 인해 예기치 않은 결과가 발생함: </p> <p> 라벨 줄 바꿈: </p> <div class="cnblogs_code"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre><span style="color: #008080">1</span> <span style="color: #008000"><!--</span><span style="color: #008000">文本域结束标签 换行导致placeholder无法正确表示</span><span style="color: #008000">--></span><span style="color: #008080">2</span> <span style="color: #0000ff"><</span><span style="color: #800000">textarea </span><span style="color: #ff0000">id</span><span style="color: #0000ff">="description"</span><span style="color: #ff0000"> name</span><span style="color: #0000ff">="description"</span><span style="color: #ff0000"> rows</span><span style="color: #0000ff">="5"</span><span style="color: #ff0000"> cols</span><span style="color: #0000ff">="30"</span><span style="color: #ff0000"> wrap</span><span style="color: #0000ff">="physical"</span><span style="color: #ff0000"> placeholder</span><span style="color: #0000ff">="这是一个多行输入框，输入您的个人描述"</span><span style="color: #0000ff">><br></</span><span style="color: #800000">textarea</span><span style="color: #0000ff">></span></pre><div class="contentsignin">로그인 후 복사</div></div></div> <p> 라벨 사이의 공백: </p> <div class="cnblogs_code"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre>1 <!--文本域标签之间有空格，导致placeholder无法正确表示-->2 <textarea id="description" name="description" rows="5" cols="30" wrap="physical" placeholder="这是一个多行输入框，输入您的个人描述"> 로그인 후 복사 결과: 공백 이유: 양식 영역에 공백( 공백, 탭, 줄 바꿈), 텍스트 영역 내의 공백은 내용으로 간주되어 자리 표시자 텍스트가 표시되지 않습니다. 올바른 작동: 1 2 로그인 후 복사 결과: 자리가 찼습니다! ! ! 인라인 블록의 기본 공백 기본적으로 인라인 블록 요소 사이에는 약 "4px" 간격이 있습니다(브라우저마다 크기가 다름). 1 2 item13 item24 item35 item46 item57 로그인 후 복사 1 *{ 2 margin: 0; 3 padding: 0; 4 } 5 ul { 6 list-style: none outside none; 7 padding: 10px; 8 background: green; 9 text-align: center;10 }11 ul li {12 display: inline-block;13 *display: inline;14 zoom: 1;15 background: orange;16 padding: 5px;17 }로그인 후 복사 원인: 태그 사이의 공백 문자로 인해 발생합니다. 해결 방법: 이때 HTML의 구조를 변경하여 이전 li의 종료 태그를 다음 li의 시작 부분에 연결하고 공백 문자를 제거할 수 있습니다. 1 2 item1item2item3item4item57 로그인 후 복사 데모를 시험해 보려면 여기를 클릭하세요 물론 공백 문자도 문자이며, 공백 문자 제거는 CSS 스타일 문자 간격 및 단어 간격을 통해 설정할 수도 있습니다. 자세한 내용은 인라인 블록 요소의 공백 문제를 해결하는 방법 텍스트 에 존재하는 공백 문자(예: 다음 줄 바꿈 및 공백)를 참조하세요. <div>They can stay 72-hours within the Shandong province after they have entered China via the Qingdao International Airport.div>로그인 후 복사 结果：浏览器解析的时候只保留单词之间的空白符被合并为一个空格。 They can stay 72-hours within the Shandong province after they have entered China via the Qingdao International Airport.로그인 후 복사 CSS 속성을 통해 텍스트의 공백 문자를 처리할 수 있습니다. : Demo Supplement한 가지 추가 사항: CSS3에는 word-wrap 및 word-break라는 두 가지 새로운 줄 바꿈 속성이 추가되었습니다.
