2019년 3월 8일 금요일

[Udemy] The Web Developer Bootcamp -4

CSS 기초

작동 원리
*.css, *.html의 파일이 있을 때 html파일 내에 css 파일의 링크를 걸어두면 해당 파일에서 명명한 대로 스타일이 변하는 것. 

a.css에 <h1></h1>은 color: purple로 설정되있으면 a.css 파일의 링크가 걸려있는 b.html내의 <h1></h1>은 보라색으로 보이는 것이다. 

컬러

1) 컬러 명으로 지정

간단하게 red, green, blue로 명명 하는것

2) 16진수로 표현
CSS의 컬러는 기본적으로 16진수 #000000 6자리의 16진수로 이루어짐

두 개씩 나눠서 빨강, 녹색, 파랑을 이루고 있다. 빛의 삼원색이다. 그래서
가산혼합을 미술시간에 배웠던것 같다. (더할 수록 밝아 진다고 해서 가산 혼합) 참고로 색의 삼원색은 빨강, 노랑, 파랑이며 감산 혼합이다. (가산혼합과 반대로 더할 수록 색이 진해짐)

그래서 컬러의 #000000은 가장 낮다. 그러므로 검정색이된다. 반대로 #FFFFFF은 숫자가 가장크다. 가장 밝은 흰색이 되는 것이다. 

색깔 참고 사이트: www.colorpicker.com

3) RGB

Red, Gree, Blue의 첫 글자를 딴것이다 위의 16진수가 두 자리씩 컬러를 표현한다고 했다. 그러면 두자리 16진수의 가장 큰값은 255이다. 0~255로 색깔을 표현하는 것이다.

문법은  rgb(0,0,0) 
          -> #000000 -> black 이 되는 것이다.

4) RGBA

RGB에 A가 붙었다. A는 Aplha를 의미한다. 투명도를 의미한다. 1은 투명도 없음 1이 가장 크며 작을 수록 투명해진다.
문법은 rgba(0,0,0,1) 또는 투명하게 rgba(0,0,0,.5)이렇게 표현한다.




댓글 없음:

댓글 쓰기