Html 서식 스타일1 (Fiksioner v4) - ㅤㅤN잡성공스쿨

안녕하세요. N잡언니입니다.

도메인 연결하는데 애를 먹었지만 다행히 티스토리에서 블로그 스팟으로 잘 안착했습니다.

블로그 스팟 테마로 블로소득님이 추천해 주신 Igniel님이 만든 [Fiksioner v4]로 적용했는데, 글을 작성할 때 중간중간 HTML을 사용해서 글을 꾸미면서 작성해야 하기 때문에 [Fiksioner v4] 테마에 기본으로 세팅된 꾸미기 서식들을 가져와 봤습니다.

자주 쓸 것 같은 것만 가져왔어요. 

(TMI..티스토리 적응한 지 얼마 안 됐는데 블로그 스팟으로 이사를 해서 다시 적응하느라 힘드네요.🥹)

박스

Box default. 지금이야말로 새로운 수익을 창출하기 가장 좋은 시대! 세상이 내 뜻대로 되지 않더라도, 나 자신의 미래는 내 의지로 만들어갈 수 있습니다.

Box info. 지금이야말로 새로운 수익을 창출하기 가장 좋은 시대! 세상이 내 뜻대로 되지 않더라도, 나 자신의 미래는 내 의지로 만들어갈 수 있습니다.

Box success. 지금이야말로 새로운 수익을 창출하기 가장 좋은 시대! 세상이 내 뜻대로 되지 않더라도, 나 자신의 미래는 내 의지로 만들어갈 수 있습니다.

Box warning. 지금이야말로 새로운 수익을 창출하기 가장 좋은 시대! 세상이 내 뜻대로 되지 않더라도, 나 자신의 미래는 내 의지로 만들어갈 수 있습니다.

Box danger. 지금이야말로 새로운 수익을 창출하기 가장 좋은 시대! 세상이 내 뜻대로 되지 않더라도, 나 자신의 미래는 내 의지로 만들어갈 수 있습니다.

<div class="box">내용을 입력하세요.</div>

<div class="box info">내용을 입력하세요.</div>

<div class="box success">내용을 입력하세요.

<div class="box warning">내용을 입력하세요.

<div class="box danger">내용을 입력하세요.

버튼

바로가기 링크 버튼 모양입니다. 색이 채워진 거랑, 테두리만 있는 2종류입니다. (버튼 색상은 홈페이지 테마 색상)

색상이 채워진 링크 있는 버튼

<button>Button default</button>

<a class="btn" href="https://www.google.com">Button default</a>

테두리만 있는 링크 있는 버튼

<button class="btn-outline">Button outline</button>

<a class="btn-outline" href="https://www.google.com">Button outline</a>

가운데 배치

버튼같은거 가운에 정렬 하고 싶을 때 사용하는 것입니다.

<div class="center">
  <button>버튼을 가운데에 배치</button>
</div>

html 코드블럭

주의사항: 특수문자(<, >, & 등)를 그대로 입력하면 안되고, 이스케이프(escape) 처리해야 제대로 표시됩니다.

• < → &lt;
• > →  &gt;
• & → &amp;

<pre><code>여기에 이스케이프 처리한 코드를 입력하세요.</code></pre>

확실히 블로그 스팟은 html 잘 모르시는 초급자분들에게는 어려운 것 같습니다. 네이버와 티스토리 편집기가 정말 얼마나 사용자 친화적인지 새삼 깨닫게 되네요.. (집 나오면 고생이다 느낌)

뭐 그냥 글만 쓰는 거면 크게 불편할 것 같지는 않지만 맞춤법 검사 기능도 없고, 표 만드는 것도 없어서 여러 가지 살펴봐야 할 것들이 많이 있네요. 일단 빨리 적응을 해야겠습니다.