아래와 같은 모양의 제목을 만들기 위해 HTML코드를 손봐야 한다.
그러나 HTML코드 모르는 초짜는 이것 저거 힘들기만 하다.
그래서 편히 사용하라고 코드를 공개한다.
복사 붙여넣기로 사용해보고 HTML코드가 익숙해지면 조금씩 변형해서 사용해보자.
h2, 폰트사이즈 36, 폰트색상:#000000,
html코드 보기에서 아래의 빨강색으로 된 항목을 수정하면 원하는 것을 얻을 수 있다.
각 항목 별로 숫자, 컬러코드, 폰트명을 원하는것으로 수정하면 된다.
HTML 컬로코드는 아래에 링크를 걸어 두었습니다.
라인 밑으로 간격을 얼마나 줄것인가 : margin-bottom: 5px;
라인 두께 (top-right-bottom-left) : border-width: 0px 0px 2px 12px;
단어 간격 : word-spacing: 3px;
위쪽 라인 위로 간격을 얼마나 줄것인가 : margin-top: 5px;
아래 라인 모양 : border-bottom-style: solid;
아래 라인 색상 : border-bottom-color: #8a3db6;
글 정렬 : text-align: left;
왼쪽 라인 모양 : border-left-style: solid;
왼쪽 라인 색상 : border-left-color: #000000;
글자 간격 : letter-spacing: 1px;
글자 줄간격 : line-height: 1.5;
라인의 끝을 오른쪽에서 얼마나 띄우나 : margin-right: 0px;
글자과 테두리간격(세로-가로) : padding: 3px 5px;
글자 색상 : span style=color: #000000;
글자 폰트사이즈 : span style=font-size: 36px;
글자 폰트 : font-family: '맑은 고딕', sans-serif;
| <h2 style="box-sizing: border-box; margin-bottom: 5px; border-width: 0px 0px 2px 12px; word-spacing: 3px; margin-top: 5px; border-bottom-color: #000000; text-align: left; border-left-color: #000000; letter-spacing: 1px; line-height: 1.5; margin-right: 0px; border-image: initial; padding: 3px 5px; border-style: solid;" data-ke-size="size26"><span style="color: #000000;"><b><span style="font-size: 36px; font-family: '맑은 고딕', sans-serif;"> h2, 폰트사이즈 36, 폰트색상:#000000, </span></b></span></h2> |
h3, 폰트사이즈 24 , 폰트색상:#8a3db6,
| <h3 style="box-sizing: border-box; margin-bottom: 5px; border-width: 0px 0px 2px 12px; word-spacing: 3px; margin-top: 5px; border-bottom-style: solid; border-bottom-color: #8a3db6; text-align: left; border-left-style: solid; border-left-color: #8a3db6; letter-spacing: 1px; line-height: 1.5; margin-right: 0px; border-image: initial; padding: 3px 5px;" data-ke-size="size23"><span style="color: #8a3db6;"><b><span style="font-size: 24px; font-family: '맑은 고딕', sans-serif;"> h3, 폰트사이즈 24 , 폰트색상:#8a3db6,</span></b></span></h3> |
유튜브 영상 자막 다운받기
유튜브 영상의 자막을 다운 받고 싶을 때 있으시죠? 제가 종종 이용하는 사이트 하나 소개해드리겠습니다. 사용 방법이 너무 쉬어 따로 설명 안드리겠습니다. 유튜브 영상의 주소를 해당 페이지
humanlife.tistory.com
티스토리 본문 하단 멀티플렉스 광고 넣는 방법
티스토리 블로그 운영자라면 누구나 한 번쯤 자신의 글 하단에 삽입되는 배너광고 또는 본문 중간중간 나오는 박스형 광고를 본 적이 있을 것이다. 이러한 광고들은 모두 구글 애드센스라는 플
humanlife.tistory.com
연예인들은 왜 월세에 살까?
누구나 알법한 연예인들은 말 안해도 돈이 많은것을 알것이다. 하지만 돈 많은 연예인들은 집을 구매하기 보다 월세에 사는 경우가 많다. 왜 연예인들은 월세에 사는 것일까? TV를 보다 보면 멋
humanlife.tistory.com
https://html-color-codes.info/Korean/
HTML 컬러 코드
HTML 컬러 차트 사각형 모양의 컬러버튼을 클릭하여 HTML 컬러 코드를 찾으세요. HTML 컬러 코드 이론 "이 이상한 기호와 숫자와의 조합이 어떤 의미가 있을까?" 하고 궁금하신가요. 그 답은 "예" 입
html-color-codes.info
'Digital nomad' 카테고리의 다른 글
| RSS에 대한 모든 것을 알아보자! (1) | 2023.08.25 |
|---|---|
| [엑셀단축키] 행 열 선택 / 삽입 / 삭제 단축키 (0) | 2023.08.24 |
| 유튜브 영상 자막 다운받기 (0) | 2023.07.18 |
| 티스토리 본문 하단 멀티플렉스 광고 넣는 방법 (0) | 2022.12.19 |
| 애드센스 수익지급계좌 우리은행 이용시 에러나는경우(안내코드:BEECT00659) (0) | 2022.09.23 |