HTML(Hyper Text Markup Language) BasicsHTML & CSS2023. 8. 14. 15:42
목차
태그 (tag)
웹 문서를 구성하는 명령어
꺽새 안에 들어있는 정보를 정의하는 형식
요소의 일부로 시작 태그와 종료 태그 두 종류
종료 태그가 없는 <br /> <hr /> 과 같은 태그가 있음(내부에 내용이 필요없음)
요소 (element)
- 빈 요소
- <br />, <hr />
- 내용 없이 구조적인 기능만 하는 요소
- 블록 요소
- h1~h6, div, list, p, ···
- 다른 요소를 포함할 수 있는 요소
- 인라인 요소를 포함할 수 있다.
- 블록 요소 이후 블록 요소를 사용하면 내용이 세로로 나타난다.
- margin, padding 값을 가질 수 있다.
- 인라인 요소
- a, span, strong, ···
- 인라인 요소는 블록 요소를 포함할 수 없다.
- 블록 요소 이후 블록 요소를 사용하면 내용이 가로로 나타난다.
- 너비, 높이 값을 가질 수 없다.
index.html
index.html 페이지는 방문자가 사이트를 요청할 때 다른 페이지가 지정되지 않은 경우 웹 사이트에 표시된 기본 페이지에 사용되는 가장 일반적인 이름이다.
속성 (attribute)
- 태그를 보조하는 명령어로 태그 안쪽에 위치
- <a href = "https://google.com">Link to Google</a>
- href는 속성, 큰따옴표("")내부 내용은 속성 값
시멘틱 요소란?
- 의미가 있는 요소
- 브라우저와 개발자 모두에게 의미를 명확하게 설명
- non-sementic 요소 예시
- span, div 등
- semetic 요소 예시
DOCTYPE
- HTML 문서 맨 처음에 명시해서 이 문서의 버전을 나타냄
- 반드시 작성해야 하며 <!DOCTYPE html>은 HTML 5 버전임을 나타냄
HTML
- 이 문서가 html로 작성되었다는 것을 알려주며 문서의 시작과 끝을 알리는 태그
- lang 속성으로 문서의 언어를 설정
HEAD
- 메타 데이터와 타이틀을 넣어주는 곳
- 웹 페이지에서 직접적으로 메타 데이터가 보이지는 않지만 페이지 인코딩 방식, 검색 엔진 등 많은 설정들을 할 수 있다.
- title은 브라우저 창 제목에 나타남
BODY
- 주로 브라우저 화면에 보이는 부분을 넣어줌
- 한 html 문서에 하나의 <body> 요소만 존재할 수 있다.
Heading 태그
목록태그
- 순서가 있는 목록(ol)
- <ol> <li>
- 순서가 없는 목록(ul)
- 설명 목록(dl)
- dl : 목록의 시작을 정의
- dt : 용어를 정의
- dd : 용어 정의(설명)를 정의
새로 알게 된 것들
- 인라인 요소는 디자인을 지정할 수 없는데 display:block을 사용해서 너비를 생성할 수 있다.
- Preformmated text
- <pre> 태그는 미리 정의된 형식의 텍스트를 사용한다.
- 리스트의 타입과 순서, 시작하는 위치를 바꿀 수 있다는 것
728x90
반응형
LIST
'HTML & CSS' 카테고리의 다른 글
CSS(Cascading Style Sheets) Basics [2] (0) | 2023.08.16 |
---|---|
CSS(Cascading Style Sheets) Basics [1] (0) | 2023.08.15 |
@kdj :: Childev'note
포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!