이 카테고리는 국비지원 과정으로 [계룡건설] 빅데이터 기반 GreenTech SW개발자 과정에서 학습하는 내용을 정리하는 공간입니다.
1. 기본 HTML 구조
- <!DOCTYPE html>: HTML5 문서임을 알리는 지시어. 태그가 아님.
- <html>: HTML 문서의 루트 요소.
- <head>: 문서의 메타 정보(제목, 문자셋, 스타일 등)를 담는 영역.
- <body>: 웹 페이지의 실제 내용을 담는 본문 영역.
- <title>: 브라우저의 제목 표시줄에 표시되는 웹 페이지의 제목을 설정.
2. 텍스트 관련 태그
- <h1> ~ <h6>: 제목을 설정하는 태그, <h1>은 가장 큰 제목, <h6>는 가장 작은 제목.
- <p>: 단락을 구분하는 태그, 본문 문단을 생성.
- <strong>: 중요한 내용을 강조하는 태그(기본적으로 볼드체로 표시).
- <em>: 강조된 내용을 표시하는 태그(기본적으로 이탤릭체로 표시).
- <i>: 이탤릭체로 표시.
- <b>: 볼드체로 표시.
- <del>: 삭제된 텍스트를 표시.
- <ins>: 삽입된 텍스트를 표시.
- <mark>: 하이라이트된 텍스트를 표시.
- <br>: 줄 바꿈을 생성하는 태그.
3. 구획 및 레이아웃 관련 태그
- <div>: 블록 레벨의 구획을 생성하는 태그, 여러 요소들을 그룹화할 때 사용.
- <span>: 인라인 요소로, 텍스트의 일부분에 스타일을 적용할 때 사용.
4. 리스트 관련 태그
- <ul>: 순서 없는 리스트.
- <ol>: 순서 있는 리스트.
- <li>: 리스트 항목.
- <dl>: 정의 리스트.
- <dt>: 용어를 정의하는 태그.
- <dd>: 용어의 정의를 제공하는 태그.
5. 테이블 관련 태그
- <table>: 테이블을 생성하는 태그.
- <caption>: 테이블의 제목을 설정.
- <thead>: 테이블의 헤더 셀 그룹.
- <tbody>: 테이블의 본문 셀 그룹.
- <tfoot>: 테이블의 푸터 셀 그룹.
- <tr>: 테이블의 행을 정의.
- <th>: 테이블의 제목 셀.
- <td>: 테이블의 데이터 셀.
6. 하이퍼링크 관련 태그
- <a>: 하이퍼링크를 생성하는 태그. href 속성에 연결할 URL을 지정.
- <iframe>: 다른 HTML 페이지를 현재 페이지 내에서 내장된 창으로 표시.
7. 미디어 관련 태그
- <audio>: 오디오 파일을 삽입할 때 사용.
- <video>: 비디오 파일을 삽입할 때 사용.
- <source>: 오디오나 비디오 파일의 여러 포맷을 지정.
- <embed>: 외부 플러그인이나 비규격 미디어 형식을 삽입할 때 사용.
8. 메타데이터
- <meta>: 문서에 대한 메타 데이터를 제공. 문자 인코딩, 저자 정보 등을 포함.
- <img>: 이미지 파일을 삽입하는 태그. src 속성에 이미지 파일의 경로를 설정.
9. 시멘틱 HTML
- <header>: 페이지의 머리말(상단) 부분.
- <section>: 페이지의 섹션을 나누는 태그.
- <article>: 독립적이고 의미 있는 콘텐츠를 포함하는 태그.
- <footer>: 페이지의 바닥글(하단) 부분.
- <aside>: 페이지의 부수적인 콘텐츠를 포함하는 태그(광고 등).
- <nav>: 네비게이션 링크들을 그룹화하는 태그.
10. 폼 관련 태그
- <form>: 사용자 입력을 받는 폼을 정의.
- <input>: 다양한 입력 필드를 정의하는 태그.
- <textarea>: 여러 줄의 텍스트 입력을 받는 필드를 정의.
- <select>: 드롭다운 목록을 만들 때 사용.
- <button>: 클릭 가능한 버튼을 생성.
11. 기타 중요한 개념
- 속성: HTML 태그에 부가적인 정보를 제공하는 부분. 예: href, src, alt, class, id 등.
- 시멘틱 구조: 검색 엔진 최적화(SEO)나 접근성 개선을 위해 의미를 담은 태그를 사용하는 방식. 예: <header>, <footer>, <section> 등.
'국비지원교육 > [계룡건설] 빅데이터 기반 GreenTech SW개발자' 카테고리의 다른 글
**[계룡건설] GreenTech SW개발자 - CSS 학습 노트 .1** (0) | 2025.02.17 |
---|---|
**[계룡건설] GreenTech SW개발자 - HTML 학습 노트 .3** (0) | 2025.02.17 |
**[계룡건설] GreenTech SW개발자 - HTML 학습 노트 .2** (0) | 2025.02.16 |
**[계룡건설] GreenTech SW개발자 - JAVA 학습 노트 .5** (0) | 2025.02.07 |
**[계룡건설] GreenTech SW개발자 - JAVA 학습 노트 .4** (0) | 2025.02.04 |