Front_ tag, 택스트 태그 종류 및 사용법, <Tag>, <img>

---

태그(tag)

마크업 할 때 사용하는 약속된 표기법을 말함 태그는 웹 문서에 표시하려는 내용을 전달하는 언어

태그는 < 와 > 를 이용하여 작성 

태그는 소문자로 씀

여는 태그와 닫는 태그를 정확히 입력

들여쓰기를 위해 tab키를 사용 

태그는 속성과 함께 사용 가능

포함 관계를 명확히 해야 함

 

 

 

텍스트 태그

<h1>~<h6>

제목 표시 

일반 텍스트보다 굵고 진하게 표시 됨

숫자가 작을수록 제목 글씨가 커짐

 

 

<p>

paragrap의 줄임말. 단락표시.

 

 

<br>

줄 바꾸기

 

 

<hr>

horizontal의 줄임말. 수평 줄 넣기 

단락의 주제가 바뀌는 경우 사용. 가로선이 표시되게 됨

 

 

<blockquote>
인용문 표시
다른 텍스트보다 안쪽으로 들어가게 됨

 

 

<pre>
preformat의 줄임말. 입력 그대로 화면에 표시

 

 

<strong>, <b>
텍스트를 굵게 표시할 때 사용
굵기차이가 거의 나지 않지만, strong은 강조하고자 할 때, b는 굵게만 표시하고 싶을 때 사용

 

<em>, <i>
이탤릭체로 표시
em은 특정 부분을 강조하고 싶을 때, i는 단순히 이탤릭체로만 표시하고 할 때 사용

 

<mark>
선택한 부분을 형광펜으로 그어놓은 듯한 효과를 냄

 

<span>
 일부 텍스트만 묶어 스타일 적용하고자 할 때 사용

<ul>, <li>
순서가 필요하지 않은 목록 만들기
항목 앞에 작은 원 같은 불릿이 붙음

 

<ol>, <li>
순서가 필요한 목록 만들기
<ol>에 type 속성을 지정하지 않으면 1부터 순차적으로 순서가 붙고,
type 속성에 여러 값을 주면 다양한 순서를 지정할 수 있다.

 

<dl>, <dt>, <dd>
제목과 설명이 한 쌍인 설명 목록 만들기
<dl>은 목록을 만들고, <dt>는 제목을, <dd>는 설명을 표시

<table>, <tr>, <td>, <th>
<table>로 표가 들어갈 자리를 만들고,
<tr>로 행을 생성
<td>로 셀을 생성
<th>로 제목 셀 시정
colspan : 가로로 셀을 합침, rowspan : 세로로 셀을 합침

 

<caption>
<table> 다음에 사용되고, 표에 제목을 붙일 수 있음
표 위쪽 중앙에 표시됨

 

<figcaption>
<table> 위에 쓰면 표 위에 제목이 표시되고, 아래에 쓰면 표 아래에 제목이 표시됨

<img>
웹 문서에 이미지를 삽입할 때 사용(gif, jpg, png)
src 속성을 사용해 이미지 파일 경로를 지정해야만 이미지 표시가 가능

 

<a>
텍스트나 이미지 앞에 지정되며, 클릭 시 다른 페이지로 넘어갈 수 있도록 하는 태그

 

<a>태그 속성

 

---