Section 6: CSS: The Very Basics
* 글속 태그들 < >는 ( )로 대체
-> 1. text-align : 텍스트의 좌우 중앙 정렬을 시켜줌.
(left, right, center 등으로 쓸수도 있고, 요소 내부에서 '몇%'만 이동하라고 %로 지정도 가능)-> 2. font-weight : 글꼴의 두께를 설정함.
(normal, bold, lighter, bolder, 100, 900 등등)
※ normal은 400과 동일. bold는 700과 동일-> 3. text-decoration : 보통 텍스트 밑에 밑줄을 긋는 용도.
(underline: 밑줄, overline:윗줄, line-through: 글씨 취소선.
스타일도 지정해줄 수 있음)
(ex: text-decoration: #f78120(색상) underline(밑줄) wavy(물결모양) 4px(선의 두께);)
-> 4. line-height : 텍스트 줄과 줄 사이의 간격을 띄우거나 줄임 (장평)
-> 5. letter-spacing : 글자간의 간격을 띄움 (자간)
-> 6. text-transfrom : 글자 앞을 다 대문자로 시작하도록 하거나,
전부 대문자로 바꾸거나, 전부 소문자로 바꿀 수 있음
-> 1. font-size :
※ 많은 단위가 있지만 보통 'px' 단위를 많이 사용함.
※ px : 'Pixel'의 준말. 가장 일반적으로 사용되는 '절대 단위'반응형 웹사이트에서는 추천하지 않음!
※ 텍스트 요소의 '글꼴'을 변경하는데 사용됨.
※ 글꼴을 바꿀 때는 유의해야 함!
- Windows와 Mac은 각각 지원하는 글꼴들이 다름.
- 외부 사용자 글꼴을 추가할 수 있으나 다소 복잡함
※ Generic-family-name : 모양이 비슷한 글꼴들의 모음집
-serif: 바탕체 / sans-serif: 고딕체 / cursive: 필기체 / fantasy: 장식체, monospace: 고정폭
-보통 글꼴 지정 맨 마지막에 generic name을 넣어준다.
(사용자의 컴퓨터에 지정 글꼴들이 모두 없을 때, 일반 글꼴을 넣어주는 것)
※ 한개~두개 정도의 백업을 제공해주는 것이 좋다!!
-> 1. "Stack" : 순서대로 사용하고 싶은 글꼴들의 목록
(ex: font-family: Segoe UI, Times New Roman, Sans-serif;
-Segoe UI 글꼴이 있으면 이것으로 출력,
-없다면 Times New Roman 글꼴로 출력,
-이것도 없다면, Sans-serif(고딕체) 중 아무거나로 표현