HTML (HyperText Markup Language)
- 태그(tag)란 HTML문서를 구성하는 명령어의 집합이다.
기본적으로 여는/닫는 태그로 구성되지만
단독으로 사용하는 태그도 있다.
태그는 element 라고도 한다.
www.advancedwebranking.com/html/
이 링크로 가면 자주 사용되는 태그들이 나온다.
1. <!DOCTYPE html> : 웹페이지가 HTML로 만들어졌음을 표현 맨 첫 줄에 선언.
2. HTML5 필수태그 : <html>, <head>, <title>, <body>
- <html></html> : 바디와 헤드태그를 감싸는 태그
- <head></head> : 본문에 대해 설명하는 정보 태그
- <title></title> : 웹페이지 탭의 제목을 표현하는 태그
- <body></body> : 본문 태그
3. 부모/자식 태그 요약
- <li></li> : 목록 태그, 내용 태그의 부모(list)
- <ul></ul> : 목록과 목록을 구별해주는 태그. <li> 태그의 부모(unordered list)
- <ol></ol> : 목록에 번호를 매겨주는 태그. <li>태그의 부모(ordered list)
4. <a> 태그
- <a>는 Anchor, 하이퍼링크(hyperlink)와 마찬가지 의미로, 월드 와이드 웹 상에서 밑줄이 그어진 단어나 문구로 나 타나며 누르게되면 다른 화면이나 페이지로 가게된다.
- 링크 걸기
- target="_blank" : 새 창에서 페이지 열기 속성
- title="xiubin world" : 링크가 어떤 내용인지 툴팁으로 보여주는 속성
<a href="https://www.naver.com" target="_blank" title="xiubin world"> 단어 </a>
5. 줄바꿈 태그<br>과 <p>
- <br> : 단순한 줄바꿈 태그이다. (line breaker)
- <p></p> : 단락을 나눠주는 태그이다. 단순한 줄바꿈이 아닌 단락이라는 정보를 표현한다. (paragraph)
- <p>태그는 단락의 경계를 분명히 하면서 CSS를 활용하여 <p>태그의 디자인을 자유롭게 변경할 수 있기 때문에
<br>태그 보다 <p>태그가 더 좋은 선택이다.
- <p>태그 사용 예
<p style="margin-top:45px;"> <!-- p태그 위쪽에 45px 만큼의 여백이 생긴다.-->