AI & Business (인공지능과 경영)

[업무 활용] Tistory 제목 서식 빨리 만들기 - 예: 대, 중, 소제목

꿈공장장100 2023. 6. 30. 15:28

티스토리를 하다보니 나 또한 제목 등을 만들면 마음에 들지 않아 오늘 서식만들기 싸이트를 찾아 보고 딱 필요한 것만 빨리 만들어 봅니다. 

 

1. 티스토리 관리 페이지에서 좌측 메뉴 리스트에서 [서식 관리]를 선택합니다. (노란색 표시)

 

2. 우측 상단의 [서식 쓰기]를 클릭합니다. (위 그림에서 빨간색 표시)

3. 우측 상단의 [기본 모드]를 선택하고 [HTML]을 선택합니다. (파란색)

4. 3과 같이 해서 들어오면 다음과 같이 HTML 코드를 작성하고 [완료] 버튼을 누름

대제목
<h2 style="box-sizing: border-box; border-width: 1px 10px; border-bottom-style: solid; border-bottom-color: #8A3DB6; border-left-style: solid; border-left-color: #8A3DB6; letter-spacing: -1px; padding: 5px; margin: 5px 0px; line-height: 1.3;" data-ke-size="size26"><span style="color: #8A3DB6; font-family: 'Noto Sans Demilight', 'Noto Sans KR';"><b>&nbsp;대제목</b></span></h2>

<결과물> 상기와 같이 하면 다음과 같은 제목 서식이 생성됨. 저는 이전에 제목을 보라색으로 해서 보라색으로 해보았습니다. 

이 대제목 관련된 다음 설명은 다음 자료를 참조하였습니다.
https://therichpeople.tistory.com/65




 

5. 상기 서식 HTML 코드

대제목
<h2 style="box-sizing: border-box; border-width: 1px 10px; border-bottom-style: solid; border-bottom-color: #8A3DB6; border-left-style: solid; border-left-color: #8A3DB6; letter-spacing: -1px; padding: 5px; margin: 5px 0px; line-height: 1.3;" data-ke-size="size26"><span style="color: #8A3DB6; font-family: 'Noto Sans Demilight', 'Noto Sans KR';"><b>&nbsp;대제목</b></span></h2>

중제목
<h3 style="border-left: 10px solid #8A3DB6; letter-spacing: -2px; padding: 0px 0px 0px 7px; margin: 5px 0px;" data-ke-size="size23"><span style="color: #8A3DB6; font-family: 'Noto Sans Demilight', 'Noto Sans KR';"><b>중제목</b></span></h3>

소제목
<h4 style="border-left: 4px solid #8A3DB6; letter-spacing: -1px; padding: 0px 0px 0px 7px; margin: 5px 0px;" data-ke-size="size20"><span style="color: #8A3DB6; font-family:'Noto Sans Demilight', 'Noto Sans KR';"><b>&nbsp;소제목</b></span>

 

참고자료

다음 분들 덕에 쉽게 배웠습니다. 감사합니다.

https://therichpeople.tistory.com/65

 

티스토리 서식 사용법, 서식 만들기 (대제목, 중제목, 소제목)

눈에 잘 들어오는 글을 쓰려면 서식을 잘 활용하면 좋습니다. 단락 구분이 눈에 잘 들어와 글의 전체 구조가 잘 보이기 때문입니다. 그런데, 티스토리에서 제공하는 서식 (인용, 구분선 등)으로

therichpeople.tistory.com

https://yuyaho.tistory.com/entry/%ED%8B%B0%EC%8A%A4%ED%86%A0%EB%A6%AC-%EC%A0%9C%EB%AA%A9-%EC%86%8C%EC%A0%9C%EB%AA%A9-%EC%84%9C%EC%8B%9D-html-%EA%BE%B8%EB%AF%B8%EA%B8%B0-%EB%AC%B4%EB%A3%8C-%EA%B3%B5%EC%9C%A0

 

티스토리 제목 소제목 서식 html 꾸미기 무료 공유

티스토리 블로그 글의 포인트가 되는 제목의 꾸미기 서식을 소개합니다. 글의 내용도 중요하지만 소제목을 어떻게 쓰냐에 따라 가독성을 높일 수 있는데요. 글쓰기 기몬모드 상단의 글자 꾸미

yuyaho.tistory.com