3 HTML 문서에서 사용되는 대표적인 태그

문서에서 사용되는 대표적인 태그

1. 그림 : img

-src 속성: 표현하는 그림에 대한 경로, url

-width / height 속성: 픽셀(px) 단위로 그림의 크기 조절

-로컬상에 위치하는 이미지는 상대경로를 사용한다.

-인라인(inline) 태그

 

 

블록(block) 태그: h, p, a

-요소 하나가 한 블록을 전부 차지한다.

인라인(inline) 태그: img, div

-빈 공간에 다른 요소가 위치할 수 있다.

 

---

 

글로벌(global) 속성

1. 스타일(style) 속성

background-color:gray

background-color:#7F7F7F

-배경색 지정(영단어, RGB 값)

 

background-image:url/path

-배경 이미지 지정

 

 

2. 스타일 태그

<style>

selector: tag name, id, class, ... {

}

</style>

-태그 내에서 스타일 속성을 지정

 

3. id, class

id

-유일한 식별자

-id를 selector로 사용하는 경우 앞에 #을 붙인다.

 

class

-그룹 식별자

-여러 요소를 그룹화하는 경우 사용

-class를 selector로 사용하는 경우 앞에 .을 붙인다.

 

 

style 태그 안의 내용을 css 파일로 저장

 

링크(link)

-관련있는 파일을 해당 페이지와 연결

 

---

 

2. 표

-table 태그로 나타낸다.

tr(table row) : tr 태그 하나가 한 행을 나타낸다.

th(table header) : 제목을 강조하는 행

td(table data) : 한 컬럼을 나타낸다.

 

시간표 만들기

 

---

 

3. 하이퍼 링크 : anchor, link

<a href="연결될 페이지의 주소">링크 이름</a>

-문서와 문서간의 연결

웹 브라우저를 통하여 웹 서버를 접속하면 출력되는 초기 화면(index.html)을 작성한다.

 

링크를 클릭하면 test.html 페이지로 이동한다.

 

---

 

4. 목록 : ol(ordered list: 숫자 붙음), ul(unordered list)