줄 간격이 좁으면 답답하고, 줄 간격이 너무 넓어도 내용이 한 눈에 들어오지 않아 가독성이 낮아집니다.
읽고 싶은 티스토리를 만들기 위한 방법으로 줄 간격을 조절하는 방법을 정리해보겠습니다.
적당한 줄 간격이 보기도 좋고 읽기도 좋다는 것은 알지만,
그 적당한 줄 간격이 얼마인지 알기 위해서는 실험과 테스트가 필요할 것 같습니다.
l 티스토리 줄 간격 조절하는 방법
STEP 1. [관리]-[스킨편집] -[HTML편집]-[CSS] 클릭
STEP 2. [ line-height ] 값 조정
보통의 기본값은 28px로 설정되어 있습니다. 값을 조정한 뒤 [적용] 버튼을 누르면 줄간격이 변경됩니다.
본문 글, 헤드(제목)의 줄간격을 각각 조정할 수 있습니다.
- 본문 글의 줄간격은 article이나 content 태그에 위치한 line-height를 조정하여 설정합니다.
- 타이틀은 h1,h2,h3,h4 태그 하단의 line-height를 조정하여 설정합니다.
l 티스토리 알쓸신잡
[HTML과 CSS]
HTML (Hypertext Mark-up Language)
웹 문서를 만들기 위해 사용하는 기본적인 웹 언어의 한 종류
웹 브라우저는 HTML의 명령어를 이해하고 실행함
ex. <img src = "image.jpg"> 와 같은 html 명령어는 "이미지파일 'image.jpg' 를 보여줘"와 같은 말이다.
CSS (Cascading Style Sheets)
HTML, XHTML, XML 와 같은 웹 언어로 만들어진 문서의 전반적인 스타일을 설정할 때 사용하는 스타일 시트 언어
문서 전체에 적용될 수 있는 표준 스타일 시트로 문서 전체의 일관성을 유지할 수 있고 수시로 스타일을 지정하지 않을 수 있게 해주는 스타일 시트이다. 문서 전체에 적용되는 글꼴, 배경색, 너비, 높이, 줄간격, 배열위치 등의 기본값을 설정할 수 있다.
[HTML - h 태그 ]
- html 에서 문서의 제목 (heading) 은 h 태그로 표시합니다. h1~h6 까지의 제목태그를 사용할 수 있으며, 뒤에 붙은 숫자가 커질 수록 하위제목, 작은 글씨 사이즈를 의미합니다.
- 웹 브라우저 상에서 h 태그는 웹상의 정보를 계층화하여 정보의 속성을 쉽게 파악할 수 있게 하는 기능을 합니다. 따라서 h태그를 잘 활용하면 검색에 유리한 구조를 만들 수도 있습니다.