7. CSS 1/3 (생활코딩 작심40시간)

cascading style sheet

css는 웹페이지에서 디자인을 담당.

디자인 역할.

html은 정보, css는 디자인

기억!

CSS 등장 배경 (원래 html만 있었음)

1. 시각적인 정보와 정보 자체를 설명하는 ol li가

폰트 컬러나 사이즈와 공존하다 보니까

관리하는게 너무 힘듬.

2. 시스템 체계를 이해하기 너무 힘듬

--> 현재는 CSS 한계에 직면하고 있어서 다른 기술이 막 터져나옴.

CSS는 html 위에 있는 것임.

SubText Prime

html tab

ul>li*5 Tab

SubText Prime

html tab

head tag : 눈에 보이지는 않지만 키워드 같이 설명해주는 것임.

body : 전체적 큰 틀.

신체는 보이고 정신은 안보이는 그런 메타포.

style Tab : 지금부터 나오는 건 CSS 브라우저야.

li {color:red;} Tab -- CSS 문법

style 태크는 HTML임.

하나의 파일안에 두개의 이질적 언어가 공존하는 것.

li 선택자 (Selector)

color:red; --> 효과 effect.

font-size : 100px; (중괄호 이용)

color:red; --> 효과 effect.

CSS 이해하는 첫 단계는 선택자를 이해하는 것.

# 자바스크립트만 빨간색으로 표시하려면?

.active (style) (. 이라는 것은 active가 있는 것들만 선택하는 약속임.) --> active를 아무 단어로 바꿔도 무방함.

<li class = "active"

class는 속성

태크 선택자 < 클래스 선택자 (우선순위가 높음)

WHY? 클래스 선택자가 더 구체적이기 떄문.

li -> color:red; 

.active -> blue

가 더 강함.