기초 html _ 2. html 기초 태그 알아보기
💜 HTML body를 꾸미는 태그💜
❔❕ 태그란?
태그는 <> 안에서 속성을 나타내주는 것들로, Element라고도 합니다.
사실 엄밀히 말하면 body도 <body>이기 때문에 body 태그라고 하는 것이 맞습니다.
그렇기 때문에 태그는 HTML을 작성할 때 제일 주요한 요소라고 할 수 있으며, HTML에서 태그는 영역 구별이나 모양 등을 만들 때, 주로 사용합니다.
input, image 태그 등을 제외한 왠만한 태그들은 여는 태그<>와 닫는 태그</>로 구성되어 있어, 태그를 쓸 때는 꼭 태그를 닫는 습관을 들이는 것이 좋습니다.1. 제목 태그
제목 태그는 h1~h5 까지의 태그가 존재하며, 제목 태그에는 폰트 사이즈, 굵기 등 고유 서식이 존재합니다.<h1>제목 태그</h1>
<h2>제목 태그</h2>
<h3>제목 태그</h3>
<h4>제목 태그</h4>
<h5>제목 태그</h5>
2. 단락 태그
<p>는 Paragraph의 줄임말로, p태그로 감싸진 부분은 한 단락을 나타내며, 제목 태그와 달리 따로 지정된 서식은 없습니다.
* html 입력
<p>안녕하세요</p> <p>반가워요</p>
* 출력값 => 안녕하세요
반가워요
* html 입력
<p> 안녕하세요
반가워요</p>
* 출력값 => 안녕하세요반가워요
+ html에 Enter를 쳐도 따로 태그를 넣어주지 않는 이상, 줄 바꾸기가 출력되지 않습니당!
다시 말해, 이 태그는 <pre> 내의 텍스트에 사용된 여백과 줄 바꿈이 모두 그대로 브라우저 화면에 나타나기 때문에 HTML 문서에 그대로 표현할 수 있습니다.
3. pre 태그
<pre>는 미리 정의된 형식(preformatted)을 사용합니다.다시 말해, 이 태그는 <pre> 내의 텍스트에 사용된 여백과 줄 바꿈이 모두 그대로 브라우저 화면에 나타나기 때문에 HTML 문서에 그대로 표현할 수 있습니다.
* html 입력
<pre>
안녕하세요, 반가워요!!
오늘도 좋은 하루 보내세요~!
<pre/>
* 출력값
안녕하세요, 반가워요!!
오늘도 좋은 하루 보내세요~!
<pre>
안녕하세요, 반가워요!!
오늘도 좋은 하루 보내세요~!
<pre/>
* 출력값
안녕하세요, 반가워요!!
오늘도 좋은 하루 보내세요~!
4. blockquote 태그
<blockquote>는 들여쓰기 기능을 가지는 태그로, 주로 글을 인용하여 쓸 때 사용합니다.* html 입력
처음 뵙겠습니다.
<blockquote>
안녕하세요 반가워요
</blockquote>
* 출력값
처음 뵙겠습니다.
안녕하세요 반가워요
5. br태그
<br>는 break의 줄임 말로 닫는 태그 없이 라인의 끝에 위치하며, 끝 맺음을 의미합니다. 쉽게 말하면, 워드에 Enter처럼 줄을 바꿀 때, 사용합니다. * html 입력
안녕하세요!<br>
만나서 반가워요!
* 출력값
안녕하세요!
만나서 반가워요!
댓글
댓글 쓰기