PART 1 |
티스토리 서식 설정 |
1# 디자인 테마 정하기
1. 새별스러운 새별 블로그 - http://blog.naver.com/seiru523/
* 사용하기 좋은 색상 조합 추천, 레이아웃을 깔끔하게 구성하는 방법 등 좋은 강의가 많음
2. Color Hex - http://www.color-hex.com/
* Hex코드, RGB, HSL, HSV 등 다양한 방법으로 색상 검색 가능
* 검색한 색상과 유사한 색상, 검거나 흰 바탕에 색상 미리보기 등 지원
* 간단한 CSS 예제 & 여러 개의 색과 색 조합 추천
2# 서식 설정하기 [블로그 관리 - 콘텐츠 - 서식 관리 - 서식 쓰기]
- 위에서 정한 테마를 목표로 서식 작성
1. 직접 서식 설정
* 티스토리 기능으로 직접 작성 후 발행
2. 직접 html 소스 작성 - https://www.w3schools.com/html/
*HTML/CSS에 대한 강의 및 예제 참고
3. 다른 사람의 서식 적용
1. HTML 서식 복사
2. 글쓰기 우측 상단의 HTML 체크
3. 복사한 서식 붙여넣기
4. 발행
3# Devin의 서식 설정
1. 제목
PART 1 |
제목 서식 |
<hr><table class="txc-table" width="784" cellspacing="0" cellpadding="0" border="0" style="border:none;border-collapse:collapse;;font-family: Verdana, "맑은 고딕", sans-serif;"><tbody><tr> <td style="width: 83px; height: 40px; border-width: 0px; padding: 1px;"><p><span style="font-size: 12pt; font-weight: bold; color: #3B4B54; ">PART 1</span></p></td> <td style="height: 40px; border-width: 0px; padding: 1px; width: 701px;"><p><span style="font-size: 20pt; font-weight: bold; color: #3B4B54; ">제목 서식</span></p></td> </tr></tbody></table> <p><br /></p> <p><br /></p>
2. 소제목
<span style="font-size: 14pt; font-weight: bold">1# 소제목</span>
<p><br /></p>
3. 그림자 상자
<div style="-moz-box-shadow: 1px 1px 3px 2px #656565; -webkit-box-shadow: 1px 1px 3px 2px #656565; box-shadow: 1px 1px 3px 2px #656565; padding: 5px"> <span style="font-size: 10pt;">콘텐츠 내용</span></div> <p><br /></p>
4, 스크롤 상자
콘텐츠 내용
<pre style="box-sizing: border-box; overflow: auto; font-family: Menlo, Monaco, Consolas, "Courier New", monospace; padding: 9.5px; margin-top: 0px; margin-bottom: 10px; line-height: 1.42857; color: #333333; word-break: break-all; word-wrap: break-word; background-color: #F5F5F5; border: 1px solid #CCCCCC; border-radius: 4px;"><span style="font-size: 10pt;">콘텐츠 내용</span></pre>
<p><br /></p>
5. 강조 상자
강조 내용 |
<table class="txc-table" width="784" cellspacing="0" cellpadding="10" border="0" style="border:none; border-collapse:collapse;font-family: "맑은 고딕", sans-serif; font-size:13px"><tbody><tr>
<td style=" width: 784px; height: 24px; border-width: 1px; border-style: dashed; border-color: #8c8c8c; background-color: #eaeaea;">
강조 내용
</td></tr></tbody></table>
<p><br /></p>