Font(6)
-
[CSS] font(5) - font-family
▶ font-family - 글꼴(서체) 지정. - 가지고 있는, 제공 가능한 폰트. [속성 값] - 글꼴 이름: 여러 개 지정할 수 있음. 속성 값으로 여러 개 입력 시 글꼴 후보 목록을 지정. + serif 글꼴 계열 이름을 지정. sans-serif, monospace, cursive, fantasy... - 글꼴 이름을 여러 개 입력 시 입력한 글꼴 이름 수만큼의 후보가 제공되고 그중 하나만 사용됨. - 입력된 후보를 모두 쓸 수 없는 경우, 해당 환경에서 쓸 수 있는 글꼴 계열 중 다른 폰트를 자동으로 찾아 사용하게 됨. - 따라서 font-family 사용 시 브라우저에 지정하기 원하는 글꼴의 이름 후보들과 그 후보가 제대로 표현되지 못했을 때 나오게 될 글꼴 계열의 이름을 함께 제공해야 함...
2020.09.09 -
[CSS] font(5) - line-height
▶ line-height - 줄 높이를 지정. [속성 값] - normal: 브라우저의 기본 정의 사용. 1~1.4 브라우저마다 다를 수 있음. 기본값. - 숫자: 요소 자체가 가지고 있는 글자 크기의 배수로 지정. 예) line-height: 2;라면 텍스트 크기의 2배. - 특정한 px 표기보다는 배수로 표기하는 것을 권장. - 일반적으로 권장하는 배수는 1.4 ~ 1.7 - 폰트의 종류에 따라 차이가 있지만 1.4 ~ 1.7이 글자를 읽는 데 문제가 없다고 판단. - 단위: px, cm, em 등 - %: 요소 자체 글자 크기의 비율로 지정. - line-height는 첫 번째 줄과 두 번째 줄 사이의 간격이 아니라 첫 번째 줄의 높이, 두 번째 줄의 높이가 됨. 예) font-size: 16px;..
2020.09.09 -
[CSS] font(4) - font-size
▶ font-size - 글자의 크기 지정. [속성 값] - 단위: px, em, cm 등 단위로 지정. - 기본값 16px(에 font-size: 16px로 지정되어있다고 가정). - %: 부모(상위) 요소의 비율로 지정. 이는 em으로 대체해 사용하는 것을 권장. - xx-small: 가장 작은 크기. - x-small: 더 작은 크기. - small: 작은 크기. - medium: 중간 크기. - large: 큰 크기. - x-large: 더 큰 크기. - xx-large: 가장 큰 크기. - smaller: 부모 요소보다 작은 크기. - larger: 부모 요소보다 큰 크기. ∴ xx-small, x-small, small 등은 명확한 크기를 을 수 없음. - 되도록 완벽하게 크기를 제어할 수 있..
2020.09.09 -
[CSS] font(3) - font-weight
▶ font-weight - 글자의 두께(가중치)를 지정. [속성 값] - normal: 기본 글자 두께. font-weight: 400;과 동일. 기본값. - bold: 두껍게. font-weight: 700;과 동일. - border: 부모(상위) 요소보다 더 두껍게(bold보다 두껍다는 개념이 아님에 유의). - lighter: 부모(상위) 요소보다 더 얇게. - 숫자: 100부터 900까지 100단위의 숫자 값 9가지. normal과 bold 이외에 글자의 두께를 제공하는 글꼴(서체)을 위한 설정. [일반적인 두께의 이름] - font-weight의 각 값은 일반적으로 다음과 같은 글꼴의 이름으로 표현됨. 값 일반적인 두께 이름 100 thin(hairline) 200 extra light(ult..
2020.09.09 -
[CSS] font(2) - font-style
▶ font-style - 글자의 스타일(기울기)을 지정. [속성 값] - normal: 스타일 없음. 기본값. - italic: 이탤릭체(활자) - oblique: 기울어진 글자 ※ 기울어진 글자체 사용 시 보통 font-style: oblique보다 font-style: italic; 사용.
2020.09.09 -
[CSS] font(1)
▶ font - 글자 관련 속성들을 지정. - 단축 속성. - font-style, font-weight, font-size, line-height, font-family의 다섯 가지 개별 속성들의 집합. [개별 속성] font-style - 글자 기울기 지정. - 기본 값: normal. font-weight - 글자 두께 지정(가중치). - 기본 값: normal. font-size - 글자 크기 지정. - 기본 값: medium(= 16px). - 미리 지정된 CSS 설정이 없다면 font-size: medium;으로 설정되어 있을 것이고 이는 16px에 해당. line-height - 줄 높이 지정. - 기본값 normal. - reset.css 적용 시 line-height의 기본 값은 약 1...
2020.09.09