TIL 04 | font of CSS

meow·2020년 7월 13일
0

HTML/CSS

목록 보기
4/12

font 장식하기

  • 폰트 선택
    폰트 이름에 띄어쓰기가 포함될 경우에는 "mia font" 이런 식으로 쌍따옴표를 붙여줘야 한다.
/*font-family*/
p {
    font-family: Arial;
}
  • 폰트 크기 변경
/* font-size */
p {
    font-size: 120px;
}
h1 {
    font-size: 2.0em;
}
/* double the font size */
/* 1em = 16px */
  • 폰트 웨이트 변경
/* font-weight */
p {
    font-weight: bold;
}
p {
    font-weight: 100 - 800;
}
  • 행간 조정
/* line-height */
p {
    line-height: 1.5;
}
  • 단락 정렬 조정
/* text-align */
p {
    text-align: center;
}
  • 기타 글자 꾸미기
/* text-decoration */
p {
    text-decoration: underline;
    text-decoration: line-through;
}

구글폰트 사용하는 방법

<link href="https://fonts.googleapis.com/css2?family=Indie+Flower&family=Raleway&display=swap" rel="stylesheet”>

구글폰트(https://fonts.google.com)에서 원하는 폰트, weight를 선택후, 링크를 카피해서 HTML <head> 안에 붙여넣으면 CSS에서 사용이 가능하다.

profile
🌙`、、`ヽ`ヽ`、、ヽヽ、`、ヽ`ヽ`ヽヽ` ヽ`、`ヽ`、ヽ``、ヽ`ヽ`、ヽヽ`ヽ、ヽ `ヽ、ヽヽ`ヽ`、``ヽ`ヽ、ヽ、ヽ`ヽ`ヽ 、ヽ`ヽ`ヽ、ヽ、ヽ`ヽ`ヽ 、ヽ、ヽ、ヽ``、ヽ`、ヽヽ 🚶‍♀ ヽ``ヽ``、ヽ`、

4개의 댓글

comment-user-thumbnail
2020년 7월 13일

오늘도 고생 많으셨어요!! 잘 보구 갑니다!

1개의 답글
comment-user-thumbnail
2020년 7월 14일

정리 잘해주셔서 감사합니다 ^^

1개의 답글