>  기사  >  웹 프론트엔드  >  HTML에 공백을 삽입하는 방법에 대한 자세한 소개

HTML에 공백을 삽입하는 방법에 대한 자세한 소개

黄舟
黄舟원래의
2017-05-26 15:00:163600검색

일반적으로 스페이스바를 사용하여 여러 개의 공백을 입력합니다. 코드를 작성할 때 스페이스바, Tab 키, Enter 키로 입력한 공백은 HTML(Hypertext Markup Language)에서 자동으로 무시됩니다. HTML은 이러한 키를 공백 문자로 처리하고 단일 공백 ​​간격으로 표시합니다. CSS는 다양한 스타일의 간격 및 들여쓰기를 제공하지만 HTML에는 간격을 직접 정의할 수 있는 도구도 있습니다.

방법 1. 공백 한 개 삽입하고 탭

1. 줄바꿈 없는 공백을 삽입합니다. 일반적으로 HTML은 스페이스바를 몇 번 눌러도 단어 사이에 공백만 표시합니다. 여러 개의 공백을 삽입해야 하는 경우   또는   코드를 입력하세요. 이를 "공간 자리 표시자"라고 합니다. 몇 개를 입력하면 페이지에 몇 개의 공백이 표시됩니다.

은 개행 문자를 생성하지 않기 때문에 줄바꿈 없는 공백이라고 합니다. 이 간격을 남용하면 브라우저가 깔끔하고 읽기 쉬운 방식으로 줄바꿈을 삽입하지 못할 수도 있습니다.

2. 너비가 다른 공백을 삽입합니다. 브라우저가 공백을 표시할 수 있도록 하는 다양한 문자 엔터티가 있습니다. 브라우저에 따라 이 내용이 약간 다르게 표시될 수 있지만  와 달리 줄 바꿈에는 영향을 미치지 않습니다.

  — "enspace"는 인쇄상의 측정 단위인 너비를 따서 명명되었습니다. 일반 공백

  — "em 공백"은 일반 공백 4개 정도의 너비입니다.

3. 줄바꿈 없는 공백을 사용하여 탭 문자를 시뮬레이션합니다. 단락을 생성하는 한 가지 방법은 첫 번째 줄 앞에 몇 개의 공백을 삽입하는 것입니다(    ). 이 방법은 HTML에서만 작동하며 CSS를 사용하는 경우 권장되지 않습니다(다른 방법은 다른 단계에서 다룹니다).

문단의 내용이 서식 있는 텍스트인 경우 "pre" 태그를 사용하세요.

4. CSS를 사용하여 단락을 생성합니다. CSS의 내부 여백 또는 외부 여백은 브라우저에 특정 표시 형식을 나타내므로 표시 효과가 더욱 일관됩니다. CSS를 잘 모르거나 설명서가 없어도 쉽게 추가할 수 있습니다. 전체 단락을 오른쪽으로 이동하는 방법은 다음과 같습니다.

HTML 문서의 93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1 섹션에 다음 명령을 삽입합니다.

<style>p.indent{ padding-left: 1.8em }</style>

"p.indent " 정의 "indent"라는 단락(p로 레이블 지정)을 만듭니다(임의로 이름을 지정할 수 있음). 나머지 명령은 단락 왼쪽에 여백을 추가합니다.

HTML 문서의 본문을 반환합니다. 단락을 추가하고 싶을 때마다 태그에 다음을 삽입하세요:

<p class="indent"></p> 。

들여쓰기 양을 조정하려면 CSS 명령에서 숫자 "1.8"을 변경하세요. 다음 "em"은 유지되어야 하며 너비를 나타내는 단위입니다.

방법 2. 긴 문단 서식 지정

1. 미리 서식이 지정된 텍스트를 사용합니다. "pre" 요소는 미리 서식이 지정된 텍스트를 정의할 수 있으며, 이는 텍스트의 공백이나 줄바꿈을 유지합니다. 따라서 e03b848252eb9375d56be284e690e873bc5574f69a0cba105bc93bd3dc13c4ec 태그에 입력된 공백이나 Enter 키는 공백이나 줄 바꿈으로 표시됩니다. 공백과 줄 바꿈이 필요한 코드 샘플, 시 또는 기타 텍스트 콘텐츠를 표시하는 데 사용할 수 있습니다.

미리 서식이 지정된 텍스트의 단점 중 하나는 너비입니다. 일반적인 하이퍼텍스트 마크업 언어처럼 사용자의 창 크기에 맞게 페이지 너비를 조정할 수 없습니다.

2. 개행 문자를 생성합니다. 0c6dc11e160d3b678d68754cc175188a 태그는 현재 텍스트 줄의 끝에 배치되며 간단한 줄 바꿈을 삽입합니다. 여러 개의 "br" 태그를 입력하여 여러 개의 빈 줄을 만들 수 있습니다. 이는 HTML 초보 학생들이 코드를 작성하는 좋은 방법이지만, CSS를 배우게 되면 이런 필수 HTML 스타일 코드는 권장되지 않는다는 것을 알게 될 것입니다. ,

3. "p" 태그를 사용하여 단락을 정의합니다. p 요소는 자동으로 앞뒤에 공백을 생성하므로 텍스트 뒤의 e388a4556c0f65e1904146cc1a846bee94b3e26ee717c64999d7867364b1b4a3 태그가 단락을 끝낼 수 있습니다. 대부분의 브라우저는 빈 줄로 단락을 구분하지만 이것이 정확한 형식을 보장하지는 않습니다.

마지막으로 텍스트와 코드를 검토할 때 코드에 "떠다니는" 추가 기호가 보이면 주의 깊게 확인해야 합니다. "

CSS(Cascading Style Sheets)는 웹페이지의 요소 위치 레이아웃(텍스트 간격 포함)에 대해 픽셀 수준의 정확한 제어를 제공하여 웹페이지 개체와 모델 스타일을 더 정확하고 정확하게 편집할 수 있도록 해줍니다.

시작 태그 뒤나 종료 태그 앞에 공백을 입력하지 마세요. 예를 들어, "Spaces3499910bf9dac5ae3c52d5ede7383485Tutorial5db79b134e9f6b82c0b36e0489ee08ed"를 입력할 때 "Spaces3499910bf9dac5ae3c52d5ede7383485 Tutorial5db79b134e9f6b82c0b36e0489ee08ed"라고 쓰지 마세요.

공백 없는 문자( )는 문자 엔터티의 예입니다. 이러한 웹 문자는 키보드로 입력할 수 없지만 해당 코드를 사용하여 문자를 삽입할 수 있습니다.

경고

Hypertext Markup Language(HTML)는 예상대로 탭( ) 줄 바꿈을 표시하지 않습니다. 표준 하이퍼텍스트 웹 페이지에는 줄 바꿈이 없으므로 "탭" 문자는 실제 의미가 없습니다.

'워드' 워드 프로세싱 프로그램을 사용하지 않고 코드 편집기나 일반 텍스트 파일에서 HTML 언어를 작성하는 것이 가장 좋습니다. 텍스트 편집 소프트웨어에서 코드를 작성할 때 공백이 웹 페이지에서 이상한 기호로 바뀌어 표시 오류가 발생할 수 있습니다. 이는 일반적으로 Word 프로그램이 텍스트 내용에 추가 데이터를 추가하는데 이 정보가 웹 브라우저에서 인식되지 않아 표시 오류가 발생하기 때문입니다.

위 내용은 HTML에 공백을 삽입하는 방법에 대한 자세한 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.