블로그에는 줄간격을 조정할수 있는 부분이 있습니다. 블로그의 스킨마다 모두 틀리겠지만 글씨 크기와 글씨체에 따라서 줄간격을 조정해야 합니다.

그렇게 함으로써 좀더 보기 좋은 본문과 블로그가 될수 있을것입니다.
그러면 글의 줄간격을 줄였을때와 늘렸을때와의 차이점을 먼저 보도록 하겠습니다.

먼저 블로그 줄 간격 120% 일때입니다.



다음으로 블로그 줄 간격 160% 일때입니다.


어느 부분이 더 깔끔하고 정돈되어 보이나요~~.//
제가 보기엔 160%로가 더 좋고, 정돈되어 보입니다. 물론 꼭 160%로 하시지 않아도 됩니다.
그냥 보이는데로 140%로 해도 되고 200%로 하셔도 됩니다.

선택은 여러분이 하시면 되고요 현재 제 블로그의 모든 글은 160%로의 줄간격입니다.


그러면 어떤 부분을 조정해야 하는지 보겠습니다


보시는데로 style.css 에서 검색 CTRL +  F 으로 line-height 을 찾습니다.
잘 보셔야 할께 line-height 은 본문 부분에도 있지만, 사이드바에도 있습니다.
그럼으로 아래처럼 .article 에 있는 line-height 을 찾아 줍니다.

.article {
width:/*@post-width*/683px/*@*/;
color:/*@post-body-color*/#8A8A8A/*@*/;
font-size:/*@post-body-font-size*/12px/*@*/;
font-family:/*@post-body-font-family*/dotum/*@*/;
word-break:break-all;
word-wrap:break-word;
overflow:hidden;
line-height:160%;
}

위에 보이는  line-height:160%; 을 추가 해주면 됩니다.

스킨에 따라 약간 드리기도 합니다.
저작자 표시 비영리 변경 금지
신고
홈으로
공감
Post by : 재아
{ ? }※ 스팸 트랙백 차단중 ...

여러분의 소중한 댓글입니다.

  1. 저는 눈이 침침해서 진즉부터 줄간격 글씨크기 널찍 크게 해놨습니다 ㅋㅋ 처음엔 어떻게 하는지 몰라서 글쓰기 안에서 하나하나 조정했었어요 ;;;

  2. ㅎ~좋은정보 감사합니다.
    한가지 질문있습니다.
    본문 글자크기는 어떤걸 조정해야 할까요?
    글쓰기에서 항상 9pt로 되는데....이걸 10pt로 고정하려고 하는데....

    • 위의 줄간격 조정하는 부분 바로 아래에 보면

      /* 줄간격 */
      .article { text-align:justify; line-height: 160%;
      overflow:hidden;
      color:/*@post-body-color=#555*/ #000000 /*@*/;
      /*@post-body-font-family=font-family:;*/ font-family: gulim; /*@*/ /*@post-body-font-size=font-size:;*/ font-size: 12px; /*@*/
      padding:15px
      }


      */ font-size: 12px; /*@*/

      이 부분의 12px 부분이 본문의 글씨 크기 부분입니다...
      현재 제 블로그의 글씨 크기가 12px 기준입니다...

  3. 좋은 정보 감사합니다. 정말 필요한 정보였습니다.
    그런데...
    알려주신 내용보고 제 소스를 보니 '줄간격' 부분은 따로 없더군요. 아마도 스킨에 따라 조금씩 달라 그런가 봅니다.

    그래서 article 부분을 찾아가 봤더니..

    line-height:/*post-body-line-height*/26px/*@*/;

    위와 같은 코드가 있는데 여기서 픽셀숫자를 아무리 늘려봐도 전혀 변화가 없네요ㅠㅠ

    무슨 방법이 없을까요?

    • 코리안님 블로거에 보시면요

      article을 검색하시고
      그 맨 밑에...

      line-height: 160%; 을 삽입해주시면 됩니다.
      그래서 코리안 블로거님의 경우는 아래처럼 되면 됩니다.


      .article {
      width:/*@post-width*/683px/*@*/;
      color:/*@post-body-color*/#8A8A8A/*@*/;
      font-size:/*@post-body-font-size*/12px/*@*/;
      font-family:/*@post-body-font-family*/dotum/*@*/;
      word-break:break-all;
      word-wrap:break-word;
      overflow:hidden;
      line-height: 160%;
      }

    • 재아님 답글 감사해요^^
      그런데..
      /*post-body-line-height*/26px/*@*/ 부분을 빼고 160%로도 바꿔봤는데 줄간격은 전혀 변화가 없어서요ㅠㅠ

    • 본문의 내용을 추가 했으니 한번 다시 보세요^^

  4. 줄간격 조절에 따라 달라보이는군요~
    내 블로그도 알아봐야겠어요~
    잘 배웠어요~^^*

  5. 바뀐 프로필 다시 봐도 멋지네요~
    저두 사랑해요~행복 하세요~^^*

  6. 저도 160퍼센트 쓰고있어요.
    너무 다닥다닥 붙으면 가독성도 떨어지고.. ㅎ

    가을 멘트? 인가요 ㅎ
    멋진데요.

    나도 뭔가 해야될거 같은.. ㅋ

    • 160%로가 좋아 보입니다...

      너무 다닥다닥 붙으면 안좋습니다 ㅠㅠ;;;

      가을멘트... 언젠가 저 자리에... 알림 메세지를 넣을수 있는 공간을 만들어야겠다 생각했었습니다..

      ... 감사르..

  7. 저는 모르고 일일이 180%로 지정해 주고 잇습니다. 글자 크기도요..ㅠ
    당장 적용해 봐야겠습니다.

  8. 줄간격하나만으로 포스팅의
    가독성이 많이 달라지는것 같더라구요
    유용한 정보 잘 배우고 갑니다.

  9. 비밀댓글입니다

    • 저는 기본적으로 댓글 달리면 방문 하고요~

      그 다음에는 rss구독을 통해서 방문하고

      다른걸로는 우측에 이웃블로그를 통해서 방문합니다.

  10. 요론거는 바로 적용시켜주는 센스...ㅎ
    좋은팁 감사합니다.~ㅋㅋ

  11. 전체적으로 블로그 디자인이 산뜻한게 좋네요!
    타이틀 부분도 아주 맘에 듭니다...
    재아님 감각이 뛰어나신 듯....^^ 즐거운 주말 되세요!

  12. 커커커 이거 좋네요..~

  13. 유용한 정보인데 ...
    .article이라는 것이 css에 없군요...저는...
    entry.article은 있는데 거기에 line-height:160%; 넣어도 line-height:200% 넣어도 전혀 반응 없네요 ㅋ;;;
    난감하군요 ㅎ

    • 한줄을 만들어 넣어보세요

      /* 줄간격 */

      .article {line-height: 160%;}

    • 넣어도 반응이 없군요...ㅎ
      참 이거 이상하네요 ㅎㅎ
      예전부터 참 제가 쓰는 스킨마다 line-height 이게 없어서 난감했는데 ...

    • 흠.. 희한하네요~..
      본문의 글씨 크기 부분을 찾아보시면
      아마 있을텐데요..

    • .article

      이부분이 아예 없어서 참 난해하네요...
      .article {line-height: 160%;}
      이걸 따로 추가해도 반응이 없는..ㅎ

      결국 그냥 매번 글 작성시 설정을 해줘야하는게 답인가요..ㅎㅎ

    • 스킨이 ; 티스토리로 만들어진게 아닌듯 하네요..

      치환자만 사용하고 나머진 다르게 이용된듯 ;;//

      ㅋㅋ 뭐라 말씀 드릴;;//

    • 티스토리에 있는 기본스킨인데...ㅎ
      제작자가 다르게 만들었나보네요 ㅎ

    • 아 그런가요~;; 이런...

      다른 방법중에도 힌트가 있겠죠~ 뭐...

    • 결국 article은 아니지만 다른쪽에서 font: 12px/1.7 < 요부분 수정으로 해결했네요.. ㅎ
      난감한 티스토리 스킨이네요 ㅎ


      body, td, input, textarea {
      font: 12px/1.7 NanumGothic, NanumGothic, NanumGothic, NanumGothic;
      color : #666;

    • 고생하셨습니다..

      ... 다른분들에게 많은 도움이 될듯 합니다.~^^

      히히.. 1.7이라고 되어 있는 부분을 퍼센트로 바꿔서

      160%로라고 해도 적용이 아마 될겁니다.~

      추석 잘 보내셨는지 몰라요??

  14. 본문 글씨체를 변경하고 나서 줄간격때문에 좌절하고 있었는데 이렇게 좋은정보가! 감사합니다. *-_-*

  15. 깔끔해 보이네요.. 좋은 정보 감사합니다..

댓글을 달아주세요!

티스토리 툴바