웹 브라우저와 HTML

---

목차

1. 브라우저와 HTML

2. VS Code

3. Element ①

---

1. 브라우저와 HTML

- 파일(html)을 출력해 문서를 읽어서 출력해주는 뷰어

- 크롬, 파이어폭스, 오페라, 사파리, 엣지
- 모바일 브라우저로 '삼성브라우저' 도 있음
- HTML (Hyper Text Markup Language) 
- HTML 문서에는 <> </> 태그 사용
- HTML에 작성된 문서가 웹 브라우저에 출력해서 보여짐


2. VS Code

- Visual Studio Code 프로그램을 통해 코드를 작성

- Prettier : 문법에 맞게 사용하고 있는지 알수있음
- Live Server : 실시간으로 출력됨을 볼수있음


3. Element ①

- 부모와 자식의 관계, 자식끼리는 형제관계
- <>로 시작해서 </>로 끝남

- <div></div> :  영역을 나누는 엘리먼트, 가장 많이 사용하는 블록요소

- <h1></h1> : 제목을 나타내는 엘리먼트, h1에서 h6까지 표현됨
- <p></p> : 단락을 나타내는 엘리먼트, text를 입력할때 사용, 위아래로 여백이 존재함
- <span></span> : 인라인 요소

- <pre></pre> : 입력한 내용 그대로 나타내는 엘리먼트, 프리티어 관여하지 않음

- <hr /> : 수평선

 

- <strong></strong> : 문장을 나타내는 엘리먼트로 굵게 표현됨. 인라인. 공지사항등 긴급한 내용을 강조할때 사용함
- <b></b> :  strong과 마찬가지로 문장을 나타내는 엘리먼트. 의미없는 그냥 굵은 글씨 볼드체. 인라인
- <del></del> : delete  삭제된 내용을 나타내는 엘리먼트
- <ins></ins> : insert  입력된 내용을 나타내는 엘리먼트

- <i></i> i  기울어진 글자를 나타내는 엘리먼트 이텔릭체, 이름,명칭, 인용구
- <em></em> : 기울어진 글자를 나태내는 엘리먼트로 강조할때 사용

 

- <ul></ul> : unordered list 순서가 없는 리스트

- <ol></ol> : ordered list 순서가 있는 리스트

- <li></li> : list의 약자로 ul과 ol안에 사용

 

- <table> : 표를 만들때 사용

    <thead> : 표의 제목

      <tr> table row : 가로 

    <tbody>

      <th> : 제목의 부분

      <td> : 내용

 

---

★ 오늘의 포인트와 남겨두기 ★

 

※ 검색은 구글에서 하기
※ padding은 내부여백, margin은 외부여백
※ 블록요소 : 한줄을 다 차지함(문단) → div, h1, p
※ 인라인 : 줄이 바뀌지 않고 한줄 안에 존재 → span

※ 로컬, 서버 차이 인지하기

※ 리눅스

※ <sub>, <sup>

※ markdown

*** 앞으로 백엔드, 서버를 배우고 블록체인까지 배워 개발자가 되는 그날까지 화이팅!!!!!!!!!!