250x250
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
Tags
- crud2
- OSI7계층
- Jest
- typescript
- JWT
- CORS
- on_delete
- 노드
- Django
- 호이스팅
- 프로미스
- 트랜잭션
- rebase
- 장고초기세팅
- bcrypt
- async/await
- westagram
- 실행 컨텍스트
- TypeError: this.boardRepository.createBoard is not a function
- django westagram
- 자바스크립트
- pm2
- nodeJS
- 스코프
- docker
- manytomanyfield
- node
- javascript
- status code
- wecode
Archives
- Today
- Total
될때까지
HTML study :: 생활코딩 | WEB1 - HTML & Internet (36/36) 본문
728x90
본 포스팅은 생활코딩 HTML 영상을 보고 개인적으로 정리한 내용입니다.
✍️정리하기
#4
- HyperText Markup Language은 쉽고 (많이 쓰이니까)중요하다.
- 웹을 만든 팀 버너스리는 저작권이 자유로운 public domain으로 선언했다.
#5
- 웹의 확장자는 ‘.html’
- 파일 선택하는 창 단축키 W:ctrl + 알파벳 ‘O’ / M:command + 알파벳 ‘O’
#6
- 강조(두껍게 표시) : <strong>강조할 문구</strong>
- 밑줄(underline) : <u>밑줄칠 문구</u>
- tag : 옷의 태그는 옷에 대한 정보를 담고 있듯이 html에서의 tag도 똑같다. 그리고 열린태그, (슬래시가 붙은)닫힌태그 1쌍으로 이루어져있다.
#7
- 제목(heading) : <h1>제목</h1> - 숫자가 작을수록 글씨가 크다. 두껍게와 줄바꿈 처리가 들어가있다.
<h1>This is heading 1</h1> 제일 큰 제목 1
<h2>This is heading 2</h2> | |
<h3>This is heading 3</h3> | |
<h4>This is heading 4</h4> | |
<h5>This is heading 5</h5> | |
<h6>This is heading 6</h6> | 제일 작은 제목 6 |
#8
- 통계 기반으로 효율적으로 공부하면 좋다.
#9
- 에디터에서 엔터를 쳐서 문단을 나눠도 웹사이트에서는 줄바꿈처리가 되지 않는다. 태그를 사용하여 줄바꿈처리를 해줘야한다.
- 줄바꿈 : <br> - 시각적 효과만 주기 때문에 닫힌 태그 x
- 단락(paragraph) : <p>단락으로 구분 지을 문장들</p>
- 의미론적으로 웹사이트를 만드는 게 더 좋은 방법이기 때문에, 내용상 문단으로 나눠야 하는 경우라면 br태그보다 p태그를 사용하는 게 좋다. p태그의 단점은 여백의 넓이가 정해져있다는 점이지만 css의 style이라는 속성을 사용하면 커스텀이 가능하다.
#11
- 이미지(image) : <img source=”위치” width=”가로 사이즈”>
- 태그의 이름만으로는 표현해야할 정보가 부족한 경우가 있다. 이럴땐 어떤 img인지 알 수 있게 source라는 단어를 줄여 src=”” 안에 가져올 이미지의 경로를 써주고, width=””안에 가로 사이즈를 적어주면 된다. 이때 사용한 src, width와 같이 추가 정보를 나타내는 아이들을 속성(attribute)이라고 한다. 속성은 태그에 더 많은 의미를 부여해준다.
#12
- 목록(list) : <li>리스트로 나타낼 아이들</li> : 부모 태그인 ol(ordered list), ul(unordered list)와 함께 2대가 같이 다닌다.
- VScode에서 여러 줄을 한번에 선택하는 단축키는 alt + ctrl
#13
- 웹 페이지의 구조
<!DOCTYPE html>
<html>
<head>
<title>웹 페이지의 제목</title>
<meta charset=”utf-8”>
</head>
<body>
<p>본문에 해당하는 내용</p>
</body>
</html>
- 컴퓨터는 모든 정보를 0과 1로 저장한다. 우리가 작성한 파일은 utf-8을 사용하기 때문에 웹 브라우저에서도 utf-8을 사용해서 열도록 명시해야한다.
#14
- 앵커(anchor) 링크를 타고 이동하는 태그 : <a href=”이동할 사이트 주소” target=”목적지” title=”설명글”>링크이동</a>
- W3C는 미래의 웹의 기준(표준)을 정하는 단체다.
#16
- 인터넷 ≠ 웹 : 인터넷(1960년대 등장)은 웹이 돌아갈 수 있도록 전 세계적으로 모든 컴퓨터들이 서로 연결되어 통신을 주고받는 하나의 거대한 네트워크(통신망)를 말한다. 웹(1990년대 등장)은 인터넷에 연결된 사용자들이 서로 정보를 공유할 수 있는 공간이다. 인터넷이 도시라면 웹은 건물, 인터넷이 도로라면 웹은 자동차에 비유할 수 있다.
#17
- 웹 브라우저, 웹 서버 기능을 하는 2대의 컴퓨터가 필요하다. 웹 브라우저(클라이언트)는 웹 서버에 request를 하고, 웹 서버는 웹 브라우저에게 response를 돌려준다.
#18
- 웹 호스팅 : github 회원가입 > 저장소 생성 > public으로 선택 > create repository > uploading > 작성한 코드를 업로드 하기 > commit 메세지 작성 > commit changes > settings > pages > source의 none을 main으로 선택 > save
- actions의 pages build and deployment 작업이 모두 끝나야 웹사이트가 성공적으로 조회된다.
#19
- http : HyperText Transfer Protocol = 웹페이지를 전송하는 통신 규칙
- 127.0.0.1 : Internet Protocol Address = 컴퓨터끼리 통신할 때 쓰는 주소 체계로, 127.0.0.1은 나의 IP주소다.
- 8887 : Port
#33
- 댓글 : disqus
#34
- 채팅 : tawk
#35
- 웹사이트 방문자 분석기 : analytics.google.com
728x90
'학습 > JavaScript, TypeScript' 카테고리의 다른 글
split() (0) | 2022.08.25 |
---|---|
map() (0) | 2022.08.25 |
JavaScript study :: 함수 (0) | 2022.03.14 |
JavaScript study :: switch문 (0) | 2022.03.14 |
JavaScript study :: 동등연산자와 일치연산자 (0) | 2022.03.14 |