1. HTML 기본 태그:
<html>, <head>, <body> 태그
- <html> 태그
- HTML 문서의 시작과 종료를 나타낸다
- <head>
- <title> : 브라우저 상단 타이틀 정의
- <meta> : 태그를 통해 언어설정, 호환성 설정 및 모바일 화면설정 SEO[Search Engine Optimization] 정보 제공
- <body> : HTML 메인 콘텐츠 영역
- 블록 태그
- 한줄에 여러 요소가 위치하지 못하는 태그 구성요소들이 라인 전체를 차지하는 태그
- 대표적으로 <div>, <ol>, <li>, <h1>~<h6> 태그
- 인라인 태그
- 태그 구성요소들이 나란히 배치될 수 있는 태그
- 대표적으로 <span>, <a>, <img> 태그
2. 제목 태그 :
콘텐츠의 제목을 표시하는 태그 -> 콘텐츠의 제목이 순감하는 문서구조를 표현한다.
<h1>이 가장 큰 제목, <h6>가 가장 작은 제목을 표현한다.
3. 문단 태그:
<p> 태그 : paragraph로 문단을 구분하기위해 사용한다.
<br> 태그: 닫는 태그가 없는 줄 바꿈태그
: 여러개의 공백을 넣기 위해 사용하는 방법
pre 태그 : 소스에 작성한 그대로 화면에 출력하는 태그
4. 형식 태그
텍스트에 의미를 부여하는 태그
<i> : 텍스트 기울임
<b> : 텍스트 굵게
<tt> : 타자기 글자 모양
<u> : 밑줄
<strong> : 강조 텍스트
<del> : 텍스트 취소선
<mark> : 형광펜 형태의 하이라이트 표현
5. 목록 태그
<ul> : unordered list 순서가 없는 목록
<ol> : ordered list 순서가 있어서 번호를 메기는 목록
<li> : 각각의 목록을 나타내는 태그
6. 하이퍼링크
<a> : anchor 태그이며 href속성을 사용해 이동할 콘텐츠의 주소를 기술하는 태그.
<a href="이동할 콘텐츠" title="말풍선 도움말" target="브라우저 윈도우 옵션"> 링크 텍스트</a>-> 이동할 위치는 상대경로로 기술
traget 속성값
_blank : 새로운 웹 브라우저 창
_self : 현재 웹 브라우저 창으로 오픈
_parent : 부모 웹브라우저 창으로 오픈
_top : 웹 브라우저 전체 영역에 오픈
책갈피
<a> : 문서 내에서 특정 위치로 이동하는 책갈피 기능
<p> : name 속성이나 id 속성을 이용해 문서 내 이동위치를 지정하고 하이퍼링크에 href=#name(id) 처럼 이동할 위치지정
이미지 링크
<a><img></a> 형식
'Programming > Web Programming (2021)' 카테고리의 다른 글
| [웹프로그래밍] 4. 이미지와 테이블 (0) | 2021.04.19 |
|---|---|
| [웹프로그래밍 실습] 3. HTML 기본태그 (0) | 2021.04.19 |
| [웹프로그래밍 실습] 6. CSS 기초 (0) | 2021.04.19 |
| [웹프로그래밍] 6. CSS 기초 (0) | 2021.04.19 |
| [웹프로그래밍 실습] 2. 월드와이드웹과 HTML (0) | 2021.04.05 |
