How to increase the line-height of post text and title in Blogger.com blog skin

블로거닷컴 포스트 내용 행간을 늘리고 싶을 때



지금 이 블로그가 사용하는 스킨은 템플릿 수정 메뉴로 들어가서 글자를 좀 키운 것입니다. 24인치 Full HD(1920*1080 이나 그 언저리) 모니터에서는 큰 불편이 없지만, 27인치 WQHD(2560*1440)모니터에서는 행간이 좀 좁은 느낌이라 그것을 바꾸어보았습니다.

This blog skin is modified to increase the font size using template menu.
In a 24 inch Full HD monitor it is  OK,  however, in a 27 inch WQHD monitor, I thought the line-height should be larger. So I changed it.

더 나은 정석이 있을 지 모르겠는데, 아래는 그냥 제가 해보고 된 것 기록입니다.
There may be a "right method", the below is just what I tried and what I found it working.


이것이 처음 화면:
Screen before modification:

블로거 템플릿 디자이너로 들어갑니다.
지금 블로그 관리화면의 왼쪽 세로메뉴에서 템플릿을 클릭한 다음,
화면에서 맞춤설정> 고급> CSS추가
Enter the Blogger Template Designer.
In Admin screen, Template in the left menu.
Then.. (I did not ckecked the English screen)

거기 CSS추가 화면에 위 화면처럼 아래와 같은 내용을 더해줍니다.
Add this css like the screenshot above.

.post-body {
line-height: 200%;}
h3.post-title{
line-height: 200%;}

(만약 붙여넣기로 해서 미리보기에 바로 적용안되면 박스 안에서 키를 좀 눌러줘서 변화가 있다는 걸 인식시켜주세요)
(If just pasting it does not work in preview screen, then do some keyboard typing in that box so that it sense the css change)

그러면 이렇게 행간이 늘어납니다.
Now we find the line-height is increased, both the post title and the post content.


이렇게 해준 이유는, 영문자는 보통, 한 행이 확보한 글꼴 높이의 2/3만을 사용합니다. 하지만 한글은 한 행이 확보한 글꼴 높이를 다 쓰기 때문에, 행간이 좁아보이기 때문입니다.
The reason why I did it is that, English words use less height than Korean words do. So with a same line-height, Korean sentences look more dense.


ps.
링크의 밑줄을 글자에서 좀 띄워 표시하거나 점선으로 표시하고 싶다면 [ 이 글을 참고하세요. ]
If you want to make the link underline more parted from the text or want to make it a dotted line, then [ follow this. ]

특히 한글 문장 아래에 붙는 링크는 아래 css를 덧붙이니 더 보기 좋았습니다.
(링크 밑줄이 글자와 겹치지 않습니다)
Especially, the link underline on the Korean text looked better when I added this:
(The link underline does not touch the word)

padding-bottom: 1px;