본문 바로가기
정보

[티스토리] 오디세이(Odyssey) 스킨 편집 #3 _ 본문 상단 제목 폰트/배경 투명도, 높이 편집

by 나도잘 2020. 11. 8.
반응형

 

 

< 계정 - 스킨 편집 - html 편집 - CSS >


[본문 상단] 제목 폰트 사이즈 

본문 게시글 상단 제목 폰트 사이즈 조절 방법

 


.article-header .title-article {
    display: block;
    width: 100%;
    max-width: 760px;
    margin: 0 0 33px 0;
    font-size: 36px;  ** 원하는 폰트 사이즈로 편집 **

<예시>

 font-size: 48px;
 font-size: 36px;

 

 


[본문 상단] 배경 투명도

본문 게시글 상단 배경 투명도 조절하는 방법

 

.article-header:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 9.5);  ** 원하는 투명도로 편집 ** 0~1 사이에서 선택한다

 

<예시>

background-color: rgba(0, 0, 0, 0.5);
background-color: rgba(0, 0, 0, 9.5);

 

 


[본문 상단] 배경 높이

본문 게시글 상단 배경 높이 조절하는 방법

 

/* area-view - 상세 페이지 */
/* article-header */
.article-header {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 400px;  ** 원하는 높이로 편집 ** 

 

<예시>

height: 400px;
height: 210px;

 

 


[본문 상단] 폰트 위치

본문 게시글 제목 폰트 위치 조절하는 방법

 

.article-header .box-meta {
    position: absolute;
    bottom: 56px;  ** 원하는 위치로 편집 ** 

 

<예시>

bottom: 56px;
bottom: 16px;

 

 


[본문 상단] 게시글 여백 조절

본문 게시글 여백 조절하는 방법

 

#tt-body-page .main {
    padding-top: 470px;  ** 원하는 위치로 편집 ** 

 

<예시>

padding-top: 470px;
padding-top: 260px;

 


나도잘

by. nadojal

 

 

반응형

댓글