[오디세이 스킨] 제목 스타일 수정

제목 스타일이란?

글을 작성하실 때 글씨 스타일을 설정할 수 있습니다. 아래 예는 제목1을 설정했습니다. 제목 스타일은 Html 태그에서 Header태그로 치환됩니다. 예로 제목1 스타일은 H2태그에 해당합니다.

 

오디세이 스킨 제목 스타일 불편한점

오디세이 스킨에서 H1 css는 뚜렷한 차이가 없습니다. 저는 대제목 용도로 본문을 나눌 때 사용합니다, 하지만 제목 스타일을 적용했을 때,  적용 안 했을 때와 차이가 없어 분리구간을 구분하기가 어려웠습니다.

 

변경방법

원리

".article-view {hx}" css를 수정하면 됩니다. 제목1 스타일을 변경하고 싶으면 ".article-view h1"을 수정하면 됩니다.

 

제목1 스타일

저는 border속성과 padding을 사용하여 스타일을 꾸몄습니다.

.article-view h2 {
    font-size: 24px;
    line-height: 1.38;
    border-bottom: 1.5px solid #A6A6A6;
    border-left: 8px solid #B2CCFF;
    padding: 4px 10px ;
}

 

제목2 스타일

제목2 스타일은 간단히 밑줄만 스타일링 했습니다.

.article-view h3 {
    font-size: 20px;
    line-height: 1.4;
    border-bottom: 1px solid #000000;
}

 

참고자료

[1] bongdong 블로그: https://bongdong.tistory.com/150

[2] dmaolon00 블로그: https://dmaolon00.tistory.com/134

[3] boan-boan 블로그: https://boan-boan.tistory.com/41

[4] finger-ineedyourhelp 블로그: https://finger-ineedyourhelp.tistory.com/5

이하여백