Tag - 텍스트 관련

프론트엔드/HTML

ksge7 2020. 8. 18. 17:24

블록 레벨의 텍스트 태그

<h1> 제목입니다 </h1>
<h2> 제목입니다 </h2>
<h3> 제목입니다 </h3>

<body> 태그 안에서 글의 제목을 표시할 때 써준다.

<hn> 태그는 제목을 뜻하는 'heading'의 줄임말인 h와 숫자(1~6)를 사용해 <h1>~<h6>까지 표현한다.

<p> 단락입니다 </p>

'p'는 'paragraph'의 줄임말로, 텍스트 단락을 만드는데 사용한다.

<span> 줄 바꾸기 예제입니다. </span>
<br>
<span> 줄 바꾸기 예제입니다. </span>

<br> 태그를 쓰면 줄바꿈이 된다.

<span> 줄 바꾸기 예제입니다. </span>
<hr>
<span> 줄 바꾸기 예제입니다. </span>

<hr>이 있는 줄에 긴 수평 줄을 넣는다.

<p> 인용문 테스트입니다 </p>
<blockquote>
인용문 테스트입니다. 이 부분은 들여쓰기가 됩니다.
</blockquote>
<p> 인용문 테스트입니다 </p>

<blockquote> 사이에 텍스트를 넣어주면 해당 텍스트는 들여쓰기가 되서 다른 텍스트와 구별된다.

<pre> 입력하는 대로 표시됩니다. </pre>

일반적인 방법으로 내용을 표현해줄 경우 내가 입력한 값 그대로 나오지 않는다.

별도의 명령이 없는 경우 자체적으로 깔끔하게 표시한다.

예를 들어 여러 개의 공백을 넣어도 브라우저 상에는 한 개의 공백만 표시된다.

<pre>를 쓰면 그 안에 있는 내용은 내가 쓴 내용 그대로 표시가 된다.

다만 <pre> 태그를 쓰면 웹 접근성이 떨어지기 때문에 사용을 잘 고려해야 한다.