font-style: normal | italic | oblique font-style: normal; 기울어지지 않은 보통의 글씨체 font-style: italic; 이탤릭체 (대부분 기울어진 글꼴이 따로 디자인되어 있음) font-style: oblique; 이탤릭체(일반 글꼴을 그저 기울여 놓음) * oblique: 비스듬한, 사선의 font-weight: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 font-weight: normal; 보통 굵기. default값. font-weight: bold; 굵게 font-weight: bolder; 원래보다 더 굵게 font-weight: li..

font size: | | | 절대 크기: 브라우저에서 지정한 글자 크기 상대 크기: 부모 요소의 글자 크기를 기준으로 상대적인 글자 크기를 지정 크기: 브라우저와 상관없이 글자 크기를 직접 지정 백분율: 부모 요소의 글자 크기를 기준으로 백분율(%)로 표시 오래 전 공부했던 것 복습! | ↪ 이 녀석 전후로 나열한 옵션들 중 하나가 그 속성의 속성값이 되어야 한다는 뜻! 속성값을 쓰는 곳에 가 들어간다면? → 이것은 어떤 특정한 속성값이 아니라 이러이러한 종류의 속성값, 즉 유형을 표시하는 것이다. '키워드'를 사용해서 글자 크기 지정 xx-small

자, 이제 본격적으로, 웹 문서를 꾸며보자. 일단 text부터! font-family font-family 속성은 text를 사용하는 요소에서 주로 쓰임. ex, , , user system에 설치되어 있지 않은 글꼴이 지정되어 있다면 웹 문서 source code에서 의도하지 않는 걸로 표시됨. (그니까 없을 경우를 생각해서, 2번째와 3번째 글꼴까지 생각해야 함!) 2개 이상의 글꼴을 지정한다면 쉼표(,)로 구분하기 ex, 위의 예시와 같이 안에서 글꼴을 한 번 정의하면, 문서 전체에 적용되고, 모든 자식 요소에 다 같은 글꼴이 쓰임! cf, 나열한 값들 중 하나가 속성값이 되어야 한다는 의미로 쓰는 콜론(:)도 아닌 저것을 어찌 쓰느냐... 검색하다 알게 됐다. 키보드에서 Enter 키 위쪽에 흔히..

웹 문서에서 쓰는 여러 tag는 다른 tag를 포함하기도 하고, 다른 tag에 포함되기도 하는 관계이다! parent element(부모 요소): 포함하는 tag ex, child element(자식 요소): 포함된 tag Style Sheet에서는, child element에 별도로 적용된 속성이 없다면? → parent element에 적용된 속성이 그대로 전달됨!!! 이게 바로 Style Inheritance (스타일 상속) ex, tag의 style에서 글자 색, 글꼴 지정한다면, 그 style은 웹 문서 전체에 적용된다. cf, 배경 색, 배경 이미지 style inheritance가 될 수 없는 애들. 그리고 style inheritance가 모든 style 충돌을 해결해주는 건 아님! → 우..

Cascading 폭포같은, 폭포처럼 흐르는 그니까 웹 요소에 2개 이상의 style을 적용하게 된다면, 우선순위에 따라서 뭐 먼저 적용할래?하고 결정하는 것이 Cascading Style Sheet (Style끼리 충돌하지 않게 도와줌!) 우선순위는 어떻게 결정되는데? 1) 얼마나 중요한데? User style → Author style → Browser basic style - 그 웹페이지를 사용하는 사람이 적용한 style이 최우선! - 그 다음 중요한 건, 그 웹페이지를 만든 사람이 적용한 style, - 마지막으로 중요한 건, web broswer가 적용한 style. 2) 적용 범위는 어디까지야? !important → inline style → id style → class style → t..