Welcome to Our Website

내 웹 페이지 또는 HTML 에서 텍스트를 들여 쓰거나 탭하려면 어떻게합니까?

업데이트:02/01/2021by Computer Hope

텍스트를 들여 쓰는 다른 방법이 있습니다. 그러나 여러 브라우저와의 호환성 및 접근성을 위해 웹 페이지에서 텍스트를 들여 쓰는 가장 보편적 인 방법에 대해 설명합니다.

추천한 방법으로 CSS&HTML

에서 들여쓰기 텍스트 또는 단락,가장 일반적으로 사용하고 권장하는 방법을 사용하는 것입니다 CSS. 아래는 CSS 가 텍스트를 들여 쓰기 할 수있는 방법에 대한 다른 예입니다., 각 예제에는 것을 배치 사이의<머리></헤드>HTML 태그가 있습니다.

다음 예제에서는 왼쪽에서 텍스트와 단락 40 픽셀을 들여 쓰는”tab”이라는 스타일 클래스를 만듭니다.

<style type="text/css"><!-- .tab { margin-left: 40px; }--></style>

한 번 위의 코드는<머리>섹션에 사용할 수 있습니다,그것에 추가하여 귀하의 단락(<p>)그로 표시됩니다.,위의 그림과 같이 HTML 문서에 CSS 를 포함하는

<p class="tab">Example of a tab</p>

는”인라인”CSS 라고 합니다. 신속하게 변경하는 데 유용하지만 장기적으로는 나중에 변경하기가 어렵습니다.

대신 모든 CSS 코드를 가져 와서 확장자를 사용하여 별도의 파일을 배치 할 수 있습니다.css. 그런 다음 모든 HTML 문서에서이 하나의 파일에 링크 할 수 있으며 해당 문서는 해당 CSS 속성을 사용할 수 있습니다. 외부 CSS 파일을 사용하면 모든 CSS 가 한 곳에서 정의되기 때문에 나중에 css 를 쉽게 변경할 수 있습니다.

<link rel="stylesheet" Type="text/css" href="http://www.example.com/basic.css">

일단이.,css 파일을 만든 파일을 수정하고 동일한 CSS 코드는 제외<스타일의>및 태그 그것으로,다음과 같은 모습입니다.

.tab { margin-left: 40px; }

마지막으로,한 번 위의 단계를 완료할 수 있습 탭 모든 텍스트를 사용하여 동일한<p class=”탭의”>를 들어 우리는 다음과 같다.

들여 쓰기의 다른 형태도 있습니다. 예를 들어 단락의 첫 번째 줄만 들여 쓰고 싶다면 위의 CSS 줄을 사용하는 대신 다음 줄을 사용합니다.,

.tab { text-indent:40px }

백분율을 사용하여 들여 쓰기 할 수도 있습니다. 예를 들어,40px(픽셀)로 들여 쓰는 대신 들여 쓰기를 5%로 바꾸어 텍스트를 현재보기의 5%로 들여 쓸 수 있습니다. 들여 쓰기의 너비를 정의 할 때 em 공간을 사용할 수도 있습니다.

보너스 팁

을 변경할 수도 있습니다에서 왼쪽으로 들여쓰기를 들여쓰기를 변경하여 margin-left 을 margin-right.

HTML 을 사용하는 권장 방법

HTML 내에서 인라인 스타일로 위와 동일한 결과를 얻을 수 있습니다., 을 사용하는 동안 위 CSS 예 쉽게 만들 수 있습을 유지하는 여러 웹 페이지해야 하는 경우 사용할 스타일을 한 번만 사용할 수 있습니다 다음은 예이다.

<p style="margin-left: 40px">This text is indented.</p>

이 첫 번째 예제에서,모든 텍스트에서 단락 태그를 들여쓰기 40 픽셀에서 왼쪽에 있습니다. 다른 단락 태그는 들여 쓰기되지 않습니다.

<p style="text-indent: 40px">This text is indented.</p>

이 두 번째 예에서는 단락의 첫 번째 텍스트 줄만 왼쪽에서 40 픽셀 들여 쓰기됩니다. 해당 단락의 추가 텍스트 줄은 들여 쓰기되지 않습니다.,

백분율을 사용하여 들여 쓰기 할 수도 있습니다. 예를 들어,40px(픽셀)로 들여 쓰는 대신 들여 쓰기를 5%로 바꾸어 텍스트를 현재보기의 5%로 들여 쓸 수 있습니다. 들여 쓰기의 너비를 정의 할 때 em 공간을 사용할 수도 있습니다.

을 변경할 수도 있습니다에서 왼쪽으로 들여쓰기를 들여쓰기를 변경하여 margin-left 을 margin-right.

대안 방법

다른 일반적이다(그러나 부적절한)방법의 들여쓰기 텍스트와 함께<blockquote>태그와 같은 다음과 같습니다., 이것이 더 쉬운 해결책이지만 접근성 문제를 소개합니다. 이 태그는 텍스트를 인용하기위한 것이고 들여 쓰기를위한 것이 아닙니다.

<blockquote>This text would be indented</blockquote>

추가 정보

  • HTML 코드를 작성할 때 들여 쓰기가 필요합니까?
  • HTML 또는 웹 페이지에서 추가 공간을 만드는 방법.
  • 관련 정보 및 링크는 들여 쓰기 정의를 참조하십시오.
  • HTML 및 웹 디자인 도움말 및 지원.

답글 남기기

이메일 주소를 발행하지 않을 것입니다. 필수 항목은 *(으)로 표시합니다