Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- Chart.js
- const 단언문
- typescript
- react
- vue.js
- click and drag
- 티스토리꾸미기
- 커스텀
- 공통컴포넌트
- 타입스크립트
- JS console
- 누구나 자료구조와 알고리즘
- TSDoc
- returnType
- 반복줄이기
- 폰트적용하기
- 2022
- NonNullable
- 제네릭
- 성능최적화
- reactjs
- React.js
- 개발콘텐츠
- React Native
- CSS
- 타입좁히기
- utilty type
- 레이아웃쪼개기
- javascript
- 리액트
Archives
- Today
- Total
몽땅뚝딱 개발자
[티스토리꾸미기] Pretendard 적용하기 / 폰트 적용하기 본문
서치하다보면 velog UI가 너무 예뻐서,, 갈아타야하는 것인가 많이 고민했다.
하지만 당장 갈아타기엔 시간이 걸릴 것 같고 티스토리만의 장점도 있기때문에 우선 급한불부터 껐다.
- font-family를 Pretendard로 변경했다.
- h1, h2, ...h4 태그는 쓸데없이 padding이 50px 정도로 들어가있었다. 그래서 항상 포스팅을 하다보면 내가 생각한 결과물대로 나오지 않아서 성취감이 -10정도 떨어졌다. 모든 padding을 0으로 수정해버렸다.
- 기본 폰트크기를 16px → 18px로 조정했다.
- 간격이 숨막혔던 코드 블록에 padding을 넓히고 border-radius를 주었다. 스크롤바 없는게 불편해서 숨기지않으려고했지만 실패.. 다음에 시도해보자.
이 정도만 해도 속이 시원하다.
귀찮아서 미루고 미루다가 반차쓴김에 날 잡고 적용해보기.. 재밌었다.
혹시 누군가에게 도움이 될까해서 남겨보는 적용방법..😀
1. 티스토리 환경설정 > 스킨편집에서 CSS에 아래 코드를 import 한다. 상단 아무데나 넣으면 된다.
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
2. /* reset */으로 시작하는 저 코드에서 아래부분을 찾아 font-family 제일 앞에 Pretendard를 넣어준다.
body,th,td,input,select,textarea,button {
font-size:20px;
line-height:1.5;
font-family: Pretendard, 'applesdgothicneo-light', 'Malgun Gothic', '맑은 고딕';
color:#666;
font-weight: 200;
}
'Design > 티스토리' 카테고리의 다른 글
[티스토리꾸미기] 독서 카테고리 책장 모양으로 꾸미기 (0) | 2023.03.02 |
---|---|
[티스토리꾸미기] 제목 형광펜 강조효과 (1) | 2021.12.10 |
[티스토리꾸미기] Tip 작성 칸 (0) | 2021.12.03 |
[티스토리꾸미기] 글쓰기 소제목 꾸미기 (0) | 2021.06.03 |
Comments