기본 태그

제목

<h1>제목</h1>
<!-- 1~6단계 -->

 

단락구분

<p>내용</P>

<br>

둘은 결과 화면에서 단락을 구분해주는 것은 같지만 <p>는 닫는 태그가 있어 구획을 구분해주고 <br>은 그렇지 않기 때문에 CSS style을 적용하기 어려움. 따라서 CSS를 쓸 땐 <p>를 사용해야 함.

인용

<blockquote>인용구</blockquote>

다른 텍스트에 비해 들여쓰기가 된 형태로 써지며, 시각장애인의 접근성에서도 다른 텍스트와 구분을 한다.

굵게

<strong>굵게할 텍스트</strong>

<b>굵게할 텍스트</b>

두 태그의 차이는 <b> 태그는 단순히 서식만 굵게 바꾸는 것이고 <strong>은 기능적으로 구분해준다.

시각장애인용 접근성 등에서도 구분하기 때문에 텍스트를 읽을 때 강조해서 읽어준다.

기울임

<em>이탤릭체</em>

<i>이탤릭체</i>

• em : 문장의 흐름상 특정 부분을 강조하고 싶을 때 // 특별히 강조하고 싶은 곳
• i : 마음 속의 생각이나 용어, 관용구 등을 강조할 때 // 단순히 다른 곳과 구분하고싶은 곳

목록

<!-- 순서가 있는 목록 Ordered List -->
<ol>
	<li> 컴퓨터 켜기 </li>
    <li> 비주얼스튜디오코드 실행하기 </li>
</ol>

<!-- 순서가 없는 목록 Unordered List -->
<ul>
	<li> 컴퓨터 켜기 </li>
    <li> 비주얼스튜디오코드 실행하기 </li>
</ul>

<!-- ol 태그의 타입 -->
<ol type="1"></ol> : 숫자(기본값)
<ol type="a"></ol> : 영문 소문자
<ol type="A"></ol> : 영문 대문자
<ol type="i"></ol> : 로마 숫자 소문자
<ol type="I"></ol> : 로마 숫자 대문자

<!-- ol 태그의 속성 -->
<ol type="a" start="3"></ol> : 시작값 지정 가능

설명목록

<dl>
	<dt>이름</dt>
    <dd>값</dd>
</dl>

<dl>
	<dt>선물용 3kg</dt>
    <dd>소과 13~16과</dd>
    <dd>중과 10~12과</dd>
</dl>

기타

<!-- 줄임말 -->
<abbr title="줄임말">이것은 줄임말입니다.</abbr>

<!-- 참고사항 -->
JS는 웹페이지에 동적인 움직임을 넣기 위해 사용하기도 합니다. <cite> JS:JavaScript </cite>

<!-- 소스코드 -->
<code></code>

<!-- 부가정보 -->
30,000원 <small>VAT 별도</small>

<!-- 아래첨자 -->
물의 화학식은 H<sub>2</sub>O입니다.

<!-- 위첨자 -->
1평은 3.3m<sup>2</sup>입니다.

<!-- 취소선 -->
<s></s>

<!-- 밑줄 -->
<u></u>

<!-- 공동 작업 문서에서 새로운 내용 삽입 -->
<ins> 새로운 내용입니다. </ins>

<!-- 공동 작업 문서에서 기존 내용 삭제 -->
<del> 기존 내용을 삭제합니다. </del>