티스토리 블로그 본문 제목 CSS 꾸미기(Odyssey 오디세이) 스킨

카테고리 없음

티스토리 블로그 본문 제목 CSS 꾸미기(Odyssey 오디세이) 스킨

AutoPrice Tistory 2022. 6. 1. 17:46

티스토리 블로그 본문 제목1, 제목2, 제목3 HTML / CSS 로 꾸미기

제목1 입니다.

제목2 입니다.

제목3 입니다.

티스토리 관리자 > 꾸미기 > 스킨편집 > HTML편집 > CSS

CSS 란에서 ctrl+F를 눌러 .article-view 를 찾습니다.(티스토리 오디세이 스킨에서만 적용)

제목1은 .article-view h2

제목 2는 .article-view h3

제목 3은 .article-view h4

각자 찾아서 아래 CSS를 붙여줍니다.

font-weight: 600; /*제목 굵기 조절*/
padding: 3px 5px 3px 10px; /*여백조정 (순서는 위, 오른쪽, 아래, 왼쪽)*/
border-left: #00aaff 12px solid;  /* 좌측 선 두께 12px */
border-bottom: #00aaff 2px solid; /* 하단 선 두께 2px */

예시)

.article-view h2 {
    font-size: 24px;
    line-height: 1.38;
font-weight: 600; /*제목 굵기 조절*/
padding: 3px 5px 3px 10px; /*여백조정 (순서는 위, 오른쪽, 아래, 왼쪽)*/
border-left: #00aaff 12px solid;  /* 좌측 선 두께 12px */
border-bottom: #00aaff 2px solid; /* 하단 선 두께 2px */
}

.article-view h3 {
    font-size: 20px;
    line-height: 1.4;
font-weight: 600; /*제목 굵기 조절*/
padding: 3px 5px 3px 10px; /*여백조정 (순서는 위, 오른쪽, 아래, 왼쪽)*/
border-left: #98DDCA 12px solid;  /* 좌측 선 두께 12px */
border-bottom: #98DDCA 2px solid; /* 하단 선 두께 2px */

}

.article-view h4 {
    font-size: 18px;
    line-height: 1.33;
font-weight: 600; /*제목 굵기 조절*/
padding: 3px 5px 3px 10px; /*여백조정 (순서는 위, 오른쪽, 아래, 왼쪽)*/
border-left: #ff0066 12px solid;  /* 좌측 선 두께 12px */
border-bottom: #ff0066  2px solid; /* 하단 선 두께 2px */
}

자료출저 - https://finger-ineedyourhelp.tistory.com/5

구글 서치 콘솔 웹마스터 도구 - 블로그 등록 후 가장 먼저 해야 할 일

사이트, 블로그 등록 후 검색 노출을 위해 가장 먼저 해야 할 일입니다. 대한민국 인터넷 포털 검색에서는 네이버와 구글이 차지하는 비중이 높기에, 네이버 서치어드바이저(네이버 웹마스터도

sstube.tistory.com

Bing 웹마스터 도구 - 검색엔진 최적화(SEO)

검색엔진최적화(SEO)를 위해 블로그, 사이트 등록 시 가장 먼저해야 할 작업입니다. 대한민국에서는 구글(Google), 네이버(Naver), 다음(Daum) 포털 사이트와 마이크로소프트(Microsoft) 검색인 Bing.com이

autoprice.tistory.com

구글 키워드 플래너 사용법 - 구글 상위 노출 키워드

구글 키워드 플래너를 사용하여 구글 광고 단가, 검색량, 경쟁 조건을 분석하여 키워드를 선택하는 법입니다. 사이트나 블로그를 운영하면서 핵심인 키워드 선택을 돕는 구글 키워드 플래너 블

10dollars.tistory.com

블랙 키위 - 네이버 키워드 웹사이트 검색량 조회, 분석

블랙 키위 웹사이트를 소개합니다. 블랙 키위는 구글 키워드, 네이버 키워드를 검색 분석 웹사이트입니다. 구글 플래너 키워드와 블랙 키위는 키워드 검색에 아주 유용한 웹사이트 입니다. 사이