블로그 폰트 사이즈 및 자간, 줄간격 설정 바꾸는 방법


블로그 폰트 수정 방법


자신이 쓴 글의 가독성을 높이기 위해서는 포스팅 능력도 중요하겠지만, 폰트 설정도 큰 부분을 차지하게 된다.


이번 시간에는 블로그 스킨 설정을 이용해서 폰트 사이즈 및 자간 그리고 줄간격 수정을 하는 방법을 알아보도록 하겠다.

 

블로그 폰트 설정하기



어렵지 않으니 겁먹지 말자



HTML과 CSS를 공부한 사람들의 블로그에 가보면 비전공자(?) 입장에서 무슨 말을 하는지 하나도 알아듣지 못하는 경우가 많은데, 필자는 어렵게 설명하라고해도 못하니까 걱정 하지 말자.



옛날에는 블로그 스킨의 선택지가 별로 없다보니 어쩔 수 없이(?) 눈치껏 알게 된 것들이고, 내가 하나하나 만져서 알게 된 만큼 주입식으로 알려줄 수 밖에 없다. 


시작하기 전에

단어 검색방법



필요한 스킬은 단 하나



컨트롤+F로 단어를 검색할 수 있다는 것은 누구나 알고 있을거라고 생각 하는데, 몰랐더라도 이제 알게 되었으니 그냥 아는 척 하자. 필자의 블로그는 마우스 우측 클릭을 제한해서 검색해야 하는 단어들을 친절하게 아래 텍스트 파일에 적어두었다.



블로그 폰트 설정 단어.txt

초보는 초보가 챙긴다 



줄간격 설정 하기

줄간격



글의 아래 위 간격을 넓히고 싶다면 CSS로 들어가 'line-height'를 찾자. 필자가 쓰는 Fastboot의 경우 26번째에 위치하고 있는데, 저 수치를 수정해주면 줄간격이 변경 된다.



만약 없다면 저 부분에 추가해주면 되는데, 처음에는 마음대로 막 추가하고 그러면 고장나는게 아닐까 무섭겠지만, 이상한걸 잘못 건드린거 같으면 컨트롤+Z로 되돌아가면 되니 걱정 하지 말자. 


폰트 크기 변경

폰트 크기



마찬가지로 CSS에서 POST-BODY-FONT-SIZE를 찾아서 수정해주면 되는데, 조금 응용해서 타이틀 폰트 사이즈를 수정하면 제목 크기가 변경된다. 위에서 이야기했듯 주입식도 좋지만 하나하나 만져보면서 응용하는 버릇을 들이는 게 더 좋다. 



실패는 성공의 어머니라는 말이 있듯 몇 번 날려먹다 보면 건드려야 할 것과, 건들지 말아야 할 것의 차이를 눈치껏 알 수 있게 될 것 이다. (응?)


자간 설정 하기


자간


HTML에서 'letter-spacing'을 찾자. 필자가 쓰는 Fastboot 기준으로는 '포스트 본문 내용'을 검색해도 위의 사진 처럼 나타나게 되는데, 이 것 역시 없다면 직접 추가해주면 된다.



필자는 한동안 1.5로 맞춰 두었는데, 글이 너무 벌어져 오히려 가독성이 떨어지는 느낌이 들어 0.1로 설정해두었다.


마무리



앞으로는 의무교육에 HTML이 포함된다고 했던가 그런 뉴스를 본 것 같은데, 나중에 이쪽으로 진출하지 않더라도 블로그 스킨 정도는 뚝딱 만들 수 있을테니 그 부분이 참 부럽다. 



사실 지금 배우는 것도 늦지는 않았지만, 시간이 없다는 핑계로.. 하하. 그럼 이상으로 블로그 폰트 수정에 관한 글을 마치며, 추가로 궁금한 게 있다면 댓글로 말씀해주시길 바란다.



다른 정보

썸네일 오류 해결방법: 대표사진 변경하기


반응형

댓글

Designed by JB FACTORY