텍스트 입력, 목록 , 표

1) 내용 입력하기

 

(1) <hn> 제목 태그

 

: ndp 1~6의 숫자가 들어감 (크기가 커질수록 작아짐)

 

(2) <P>

 

- 텍스트 단락만들기

- 텍스트 앞뒤로 빈 줄이 생김

- 줄바꿈 안됨(단 웹브라우저 크기 넘어가면 자동으로 넘어감)

 

(3)<br>

 

- 줄바꿈 태그

 

- 닫는 태그 없음

 

(4) <blcok1uote>

 

- 인용문 태그

 

- 자동으로 조금 들어가서 시작함

 

(5) <stron> ,<b>

 

- 텍스트 굵게 표시

- <b>나 <i> 는 단순히 텍스트를 진하게 그리고 이텔릭체로 표시 하는 역할

- <stron> 나 <em>은 실제 페이지 내의 중요한 부분을 강조하고 싶을 때 사용 

 

(6) <em> , <i>

기울김 태그

 

<em>: 특별히 강조하고싶은 부분, 다른 텍스트와 구분

 

,<i>:관용구

(7) <hr> 

- 가로로 선 긋는 태그 

- 종료 태그 없음

 

2) 목록 만들기

 

(1) <ol>, <li>

<ol> : 순서 있는 목록

기본형:

<ol>

<li>  항목1 </li>

<li> 항목2</li>

<ol>

<ol type="a" start="b">

 

-> 1234 대신 알파벳으로 순서 적용 가능

 

(2)<ul>

 

순서 없는 목록

 

(3)<li>

<ol> <ul> 의 하위 목록 표현할 때 사용 

 

Bullet 이용해요 원이나 사각형등 기호 사용 가능

 

(4) <dl><dt><dd>

- 설명 목록

 

- 이름(name) 값(value)형태로 된 목록

 

<dt> : name , <dd>value(설명)

기본형:

<dl>

<dt>이름</dt>

<dd>값</dd>

<dl>

 

 

3) 표 만들기

 

(1) table 기본 태그 

 

<table> :  표 만드는 태그, 표 전체를 감싸는 데 사용 

<caption> table title </caption>   : 표 제목 생성 태그

<tr> : 행 지정

<td>셀 지정(1행 1열)</td> :  열 의미 

<td>셀 지정(1행 2열)</td>

</tr>

<tr>

<td>셀 지정(2행 1열)</td>

<td>셀 지정(2행 2열)</td>

</tr>

</table>

 

<td> 대신 <th> 사용시 내용이 진하게 표시 :  표의 제목 열로 부모 태그 <tr>안에 있어야함 

 

(2) table 그룹 관련 태그 

 

• <thead> , <tbody>,<tfoot>

 

-> 테이블에 제목 본문 하단을 나눈 것

 

• <td rowspan= "합칠 셀의 개수">셀의 내용</td>: 행 합칠 때

 

• <td colspan = "합칠 셀의 개수">셀의 내용</td> : 열 합칠 때

 

• <col> : <colgroup> 의 하위 태그

- 열 1개만 지정 ( 닫는 태그 없음)

- span 속성 사용하여 열을 그룹으로 묶을지 설정

ex )  <col span = "3" >  -> 세개의 열을 그룹으로 묶음 

 

• <colgroup> : <col>태그 2개 이상 묶어서 사용