티스토리 뷰
2023 개발자 기술 블로그, 나만의 블로그를 만들어 보기 시작했다. 누가 보든지 말든지 난 내 길을 가겠다, 내 취미, 내 도파민, 내 유흥, 내 쾌락, 그냥 이렇게 계속해보자. 몸이 힘든 건 어떻게 이겨낼까? 잠 줄이고 싶지 않은 데,,
오늘 알아볼 내용은 인터넷, HTML, CSS, Javascript 입니다. 부족하지만, 도움이 되시는 분께서는 참고로 해주세요.
이해하는 능력이 떨어져서 많이 부족합니다. 너그럽게 봐주세요
↓Front roadmap↓
Internet(인터넷)
◈ 질문
- 인터넷은 어떻게 작동될까?
- HTTML,HTML4,5는 뭘까?
- 브라우저는 무엇일까?
- 도메인은 무엇일까?
- 망들은 어떻게 연결되어있을까?
HTML의 정의는?
◈ 정의
- HTML(Hypertext Markup Language, 하이퍼텍스트 마크업 언어)는 웹페이지가 어떻게 구조화되어 있는지 브라우저로 알 수 있도록 하는 마크업 언어
◈ 구조
- HTML페이지를 구성하는 법
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>My test page</title>
</head>
<body>
<p>This is my page</p>
</body>
</html>
<! doctype html> → 문서형식, doctyp은 HTML 페이지가 자동 오류 검사나 다른 유용한 것이 가능한 좋은 HTML을 의미하는 연결고리처럼 작동하는 것을 뜻함. 즉, <!doctype html>는 유효한 문서 형식을 나타내는 짧은 문장.
<html></html> → <head> 요소. 홈페이지 이용자에게는 보이지 않지만 검색 결과에 노출될 키워드, 홈페이지 설명, CSS스타일, character setdeclaration 등 HTML 페이지의 모든 내용을 담음.
<meta charset="utf-8"> → HTML 문서의 문자 인코딩 설정을 UTF-8로 지정하는 것이며 예시에서 지정한 UTF-8에는 전 세계에서 사용되는 언어에 대한 대부분의 문자표시. 페이지에 포함된 모든 텍스트 처리가능. 설정하면 문자 인코딩과 관련된 일부 문제를 피하는 데 도움이 됨.
<title></title> → 페이지 제목이 설정되며 페이지가 로드되는 브라우저 탭에 표시되는 제목으로 사용.
<body></body> → 텍스트, 이미지, 비디오, 게임, 재생 가능한 오디오 트랙 등을 페이지에 표시되는 모든 콘텐츠.
CSS란?
- Cascading Style Sheets는 웹페이지를 꾸미려고 작성하는 코드. Style sheet 언어.
- HTML이 뼈대 구조를 잡는다면, CSS는 색감을 넣는다. 디자인 느낌입니다.
p {
color: red;
}
- 전체구조 : rule set
- p : selector(선택자) → p는 HTML 요소 이름, 다른 요소를 꾸밀 때는 선택자만 바꿈
- color : property 속성 → 요소를 꾸밀 수 있는 방법
- red : property value 속성 값 → 콜론 뒤에, 주어진 속성을 위한 많은 가능한 결과 중 하나를 선택하기 위해 속성 값 가짐.
- color: red; : Declaration → color: red와 같은 단일 규칙, 꾸미기 원하는 요소의 속성을 명시.
Javascript란?
- 동적 기능으로 런타임 객체 구성, 변수 매개변수 목록, 함수 변수, 동적 스크립트 생성, 객체 검사 그리고 소스 코드 복구.
- javascript 언어 자체를 다루며 웹페이지 또는 다른 사용 환경에 대해 다루지 않음.