어제 블로그를 정리하다가 스킨을 바꿔봤는데,
티스토리의 기존 스킨에서 글꼴(폰트)를 변경하고 싶었다.
내일배움카드로 배웠던 CSS의 지식을 되살려 결국 원하는 폰트로 바꾸는 데 성공하였다.
이 방법을 공유한다. :-)
먼저, 티스토리 관리자 페이지에서 스킨 변경을 하는데, 내가 선택한 스킨은 "letter"이다.
원하는 글꼴을 찾아 폰트 다운로드 url 코드를 복사한다.(나는 눈누 글꼴 사이트에서 가져왔다. https://noonnu.cc/)
내가 원하는 폰트는 서평원 꺾깎체로 폰트를 클릭하면 복사할 수 있는 url 코드가 나온다.
이제 스킨 편집을 눌러서 CSS 화면을 클릭하여 복사한 폰트(웹폰트로 사용) url 코드를 붙여넣는다.
이전에 작성했던 글의 하단 부분을 참고하면 font-face에 대해 자세히 나와있다. (https://yaga.tistory.com/83)
[CSS] 스타일 상속 및 Font 관련 CSS 속성(2021-09-28)
<!DOCTYPE html> 스타일의 상속 title Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud..
yaga.tistory.com
CSS에서 폰트를 등록(font-face 태그)한 뒤, 하단의 font-family를 'SLEI GothicTTF'로 설정한 후 적용 버튼을 누르면 끝
아래와 같이 폰트가 바뀐 것을 확인할 수 있고, 다른 폰트도 이런식으로 가능하다.
배운 것을 이렇게 바로 사용할 수 있다니...
내 스스로에게 칭찬, 개발자인 오빠가 보기엔 많이 답답했겠지만...
어찌되었던 간단한 것일지라도 스스로 해결했다는 것에서 뿌듯했음!
'IT > HTML&CSS' 카테고리의 다른 글
| [CSS]css 선택자 결합 & 복잡한 선택자 사용법 (0) | 2022.11.30 |
|---|---|
| [CSS]css 변형(transform) & 트랜지션(transition) (0) | 2022.11.30 |
| [비즈니스] 아웃룩 자주쓰는 메일 서식 저장하기 (0) | 2021.12.07 |
| [CSS] html+css 활용 예제 풀기(2021-10-26) (0) | 2021.11.25 |
| [CSS] box-sizing / 가상태그 After, Before / 순서선택자(2021-10-21) (0) | 2021.11.25 |