HTML(Hypertext Markup Language)
HTML은 웹 페이지를 만들기 위한 언어 중 하나이다.그렇기에 기본적인 구조, 즉 웹페이지의 뼈대를 제대로 알기 위해서는 공부하는 것이 유리하다.
- 마크업 언어[MarkUp Language]란 무엇인가?
(https://namu.wiki/w/%EB%A7%88%ED%81%AC%EC%97%85%20%EC%96%B8%EC%96%B4)
우리의 지식 총집합인 나무위키님이 말씀하시기를...."문서가 화면에 표시되는 형식을 나타내거나 데이터의 논리적인 구조를 명시하기 위한 규칙들을 정의한 언어의 일종이다."
무슨말인지, 이해가 잘 안되는 데 쉽게 말해서
웹 페이지 화면에 뜨는 문장이나, 그림, 표 등의 내용에 대한 정보가 아닌 문장의 그림과 표의 배치, 글자의 크기와 모양, 줄 간격등을 알려주는 기능을 해준다.
기본구조
태그(tag), content(내용), attribute(속성), element(요소)
- 태그(tag), content(내용)
HTML에 구조를 크게 보면 총 세부분으로 나뉜다.
<html>,<head>,<body>
여기서 주의할 점이 있는데,
위에서 말했듯이, HTML은 마크업 언어이다. 그
그래서 아래와 같이 태그를 사용하여 데이터(내용)를 표현한다.
<a>이지이지</a>한번 태그를 열었다면, 잊지 말고 닫는 태그가 있어야 한다!
하지만,HTML은 미리 여러 가지의 태그가 정의되어 있고, 사용자의 용도의 맞게 태그를 설정할 수 있다.
(https://www.w3schools.com/tags/tag_a.asp) - 참고: 여러 태그
그래서, 예외는 항상 존재하는 법인데!
여는 태그는 있지만, 닫는 태그는 존재하지 않는 것은
```
<br>
<img>
<meta>
<link>
<input>
<hr>
```이 태그들은 태그안에 넣을 내용이 없기 때문에 제외된다!
그렇다고, 닫는태그를 안한다고 오류는 나지 않는다.그냥 그렇다는 것,,!
- attribute(속성)
가장 기본적으로 자주 사용하는 attribute로는 아래와 같다.
- class
- id
- style
- title
이렇게 속성값이 필요한 이유는 당연히 요소에 적절한 정보를 기입해야하기 때문인데,
문제를 풀어본 결과,
class와 id는 name을 정해줘서, css에서 각 name을 이용해 접근하기 쉽게 하기 위해서
자주 사용한다.
- 이건, css파트 쪽에서 다시 또 말할 수 있겠지만, css는 우선순위가 정해져 있어 그 순서대로 적용된다.
!important > inline style attribute > id > class, 다른 attribute, 수도클래스(:first-child같은 것) > tag element
3.element(요소)
HTML요소는 시작태그에서 종류태그까지 모든 것이 있다.
아래와 같이 쓰면 되는데! 태그설명에서 말했듯이, 열었다면 닫는것도 기억해야한다는 것!
```<태그 이름> 내용어쩌고 </태그이름>```