[220403] 기본 개요 / 특수문자

HTML ( Hyper Text Markup Language )

페이지의 제목, 문단, 표, 이미지, 동영상 등 웹의 구조를 담당

 

CSS ( Cascadig Style Sheets)

실제 화면에 표시되는 방법(색상, 크기, 폰트, 레이아웃 등)을 지정해 콘텐츠를 꾸며주는 시각적인 표현(정적)을 담당.

 

JS (JavaScript)

콘텐츠를 바꾸고 움직이는 등 페이지를 동작시키는 동적 처리를 담당.

 

크로스 브라우징

크로스 브라우징(Cross Browsing)이란 조금은 다르게 구동되는 여러 브라우저에서, 동일한 사용자 경험(같은 화면, 같은 동작 등)을 줄 수 있도록 제작하는 기술, 방법.

 

viewport

: 하나의 webpage가 출력(=렌더링)되는 전체의 영역

 

특수문자

` Backtick, Grave

~ Tilde

! Exclamation mark

@ At sign

# Sharp, Number sign

$ Dollar sign

% Percent sign

^ Caret

& Ampersand

* Asterisk

- Hyphen, Dash

_ Underscore, Low dash

= Equals sign

" Quotation mark

' Aposrophe

: Colon

; Semicolon

, Comma

. Period, Dot

? Qusetion mark

/ Slash

| Vertical bar

\ Backslash

() Parenthesis

{} Brace

[] Bracket

<> Angle Bracket

 

 

상대경로

./ : 현재 위치 (생략가능)

../ : 부모 디렉토리

절대경로

http : 원격

/ : 최상위 root

 

CSS 초기화
: 브라우저 마다 기본으로 설정되어 있는 css 를 초기화 시키는 것

https://www.jsdelivr.com/package/npm/reset-css

jsDelivr - A free, fast, and reliable CDN for Open Source

 

인라인 요소 Inline
글자를 만들기. 위한 요소
ex) span

• 요소가 수평으로 쌓임
• 콘텐츠의 크기만큼 자동으로 줄어듬
• 요소의 가로/세로 너비 지정 불가
• 요소의 내/외부 여백은 좌우 가능 상하불가
• 블록 요소를 자식으로 가질수 없음
• baseline 이 있음

블록 요소 Block
상자(레이아웃)를 만들기 위한 요소
ex) div

• 요소가 수직으로 쌓임
• 가로는 부모 요소의 크기만큼 자동을 늘어남/ 세로는 콘텐츠 크기만큼 줄어듬
• 요소의 가로/세로 너비 지정 가능
• 요소의 내/외부 여백 지정 가능
• 인라인과 블록 요소 모두 자식으로 가질 수 있음

인라인 블록 요소 Inline-block

ex) input

• 요소가 수평으로 쌓임
• 여백과 가로세로 지정가능

 

HTML 전역속성

:모든 HTML에서 공통으로 사용할 수 있는 속성

ex) title , style,  class, id

<div date-name = "kim"></div>