이전 프로젝트(~2022)/2022 여름 Spring프로젝트
HTML에서 필요한 내용 정리 (태그,요약)
azure05
2022. 7. 5. 16:59
기본태그
| <!DOCTYPE html> | 웹 문서의 유형을 html로 지정 |
| <html lang="ko"> | 문서를 html로 시작, 언어를 한국어로 지정 |
| <head> | 주로 브라우저 정보를 입력하는 곳 | |
| <meta> | 메타 데이터 입력, 주로 <meta charset="UTF-8" 처럼 입력 |
|
| <title> | 문서의 제목 | |
| <body> | 문서의 내용을 입력 | |
문서구조 태그
| <header> | 헤더 영역 |
| <main> | 메인영역 |
| <section> | 콘텐츠 영역 |
| <aside> | 사이드 바 영역 |
| <footer> | 푸터 영역 |
내용 입력
텍스트 입력
| <h1>,<h2>, ... | 제목 |
| <p> | 단락 |
| <br> | 줄 바꿈, 닫기태그 없음 |
| <blockquote> | 인용문, 들여쓰기 적용됨 |
| <strong> | 텍스트 굵게, 주로 중요한 내용일 때 |
| <b> | 텍스트 굵게, 단순히 굵게 표시할 때 |
| <em> | 텍스트 기울임,강조할 때 |
| <i> | 텍스트 기울임, 단순 |
| <u> | 텍스트 밑줄 |
| <s> | 텍스트 취소선 |
목록입력
HTML에서는 목록을 만드는 태그가 있다.
대표적으로는 <ul>,<ol>,<li> 태그가 있다.
순서가 없는 목록태그 :<ul>
순서가 있는 목록태그 :<ol>
| <ol> | 순서가 있는 목록 | ||
| type= | "1" | 숫자(기본값) | |
| "a" | 영문 소문자 | ||
| "A" | 영문 대문자 | ||
| "i" | 로마 숫자 소문자 | ||
| "l" | 로마 숫자 대문자 | ||
| start="2" | 2부터 시작 | ||
| <ul> | 순서가 없는 목록 | ||
표 입력
기본형
| <table> | 테이블 만들기 | ||
| <caption> | 표 제목 | ||
| <tr> | 행 삽입 | ||
| <td> | 셀 삽입 | ||
| <th> | 셀 삽입(진하게 표시) | ||
| <thead> | 표 중 제목, 여러 페이지에 걸쳐 고정 가능 | ||
| <tbody> | 표 중 본문 | ||
| <tfoot> | 표 중 요약, 여러 페이지에 걸쳐 고정 가능 | ||
이미지 삽입
하이퍼링크 삽입
폼 입력
기본형
| <form> | method= | get | 사용자 입력 내용이 드러나게 서버로 넘겨줌 |
| post | 사용자 입력 내용이 드러나지 않게 서버로 넘겨줌 |
||
| name= | 자바스크립트로 폼 이름 지정 | ||
| action= | 서버 프로그램 지정 | ||
| target= | 열어볼 파일 위치 지정 | ||
| autocomplete= | 자동 완성기능 지정(기본값 on) | ||
| <fieldset> | 폼 내부에서 구역을 나눔 | ||
| <legend> | 구역 제목 붙이기 | ||
해당 글을 작성할 때 참고한 사이트, 블로그
https://yunbinni.tistory.com/63
HTML 태그 모음 & 요약정리
기본 태그 <!DOCTYPE html> 웹 문서의 유형을 html로 지정 문서를 html로 시작, 언어를 한국어로 지정 주로 브라우저의 정보를 입력하는 곳 메타 데이터 입력, 주로 처럼 입력 문서 제목 문서 내용을 입
yunbinni.tistory.com
HTML Basic
W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.
www.w3schools.com