[조코딩] html 기초강좌 1강 - 태그 이해하기

* 유튜브 '조코딩 - [HTML 기초 강좌 1강] 태그 이해하면 네이버를 해킹할 수 있다고?' 개념 정리

참고 영상 : https://youtu.be/JMLBBv05ORw

 

• HTML : HyperText Mark up Language의 약자로 Hypertext(우리가 클릭했을 때 다른 사이트로 넘어갈 수 있는 링크)로 구성된 Mark up(구조를 표시하는) 언어를 말한다.
• 구성

<태그이름>내용</태그이름>

- /가 없음 → 열린 태그

- /가 있음 → 닫힌 태그

 

• 웹사이트의 구성 예시 (더 세분화할 수 있음)

출처 : http://news.kbs.co.kr/news/view.do?ncd=5086001&ref=A

- ex) 기사는 제목과 기사 내용으로 세분화할 수 있다.

<div class="기사">
    <div class="제목">
        <h1>[테크톡]2021년 우주경쟁 본격화 ...</h1>
    </div>
    <div class="기사 내용">
        <b>기사 머리말</b>
        <img src="이미지 주소" />
        <p>기사 본문</p>
    </div>
</div>

 

• Division : 분할

<div></div>

- 구역을 나눠주는 기능

 

• Headline : 제목

 

 

<h1></h1>

 

• Bold : 볼드체

<b></b>

 

• 개발자 도구

- F12를 눌러 현재 웹사이트의 HTML 코드를 보거나 수정할 수 있음. 단, 수정의 경우 그 사이트를 해킹한 것은 아니고 우리가 서버에서 받은 HTML 코드를 수정한 것뿐이다. 서버 안에 있는 코드를 수정해야 다른 사용자도 볼 수 있는 '해킹'을 했다고 볼 수 있다.

 

• Front-End, Back-End의 원리

조코딩 유튜브 캡처

 

• 추천 학습 사이트

1. 코드 아카데미 : https://www.codecademy.com/learn/learn-html
2. 생활 코딩 : https://opentutorials.org/course/1

 

노션으로 보기 : www.notion.so/supha/html-1-d3c668c299ae427ba1914de52431a06e

[조코딩] html 기초강좌 1강 - 태그 이해하기