FOCUS

はてなブログテーマ"Focus"のカスタマイズやあれこれ

Focusで使用される各種要素(アセット)一覧

f:id:ganapati55:20171011145040j:plain

見出しh1

見出しh2

テスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文です

※タグ指定による装飾(エディタボタン操作と同じです)

太字テスト本文です<b>をつかっています。

斜体テストです<i>を使っています。###########AAAAAAAAAAA

打消し線テストです<s>を使っています。########AAAAAAA

下線のテストです。<u>を使っていますAAAAAAAAAA

※マークダウン記法による装飾

マークダウンem指定

マークダウンStrong指定

マークダウン下線指定はemと同じ

見出しh3

テスト本文ですテスト本文ですテスト本文です テスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文です

テスト本文ですテスト本文ですテスト本文ですテスト本文ですテスト本文です

テスト本文ですテスト本文ですテスト本文です

見出しh4

見出しh5
見出しh6

pタグにクラス指定で簡単吹き出し表示の事例

左側だよ

右がわだよ

<p class="l-fuki me">左側だよ</p>

<p class="r-fuki me">右がわだよ</p>

divタグを使ってしっかり表示する吹き出しの事例

左側の文章

2行表示も簡単

右側の文章

2行表示も簡単

<div class="l-fuki me"><span class="dscmel">
<p>左側の文章</p>

<p>2行表示も簡単</p></span>
</div>

<div class="r-fuki me"><span class="dscmer">
<p>右側の文章</p>

<p>2行表示も簡単</p></span>
</div>

リストは特に設定していません。

  • リスト
  • リスト
  • リスト

普段使いの引用もシンプルなものです

引用です

引用に変わる様々なBOXデザインを用意

引用っぽいBOXテキストテキストテキストテキストテキストテキストテキスト

スタイリッシュな引用っぽいBOXテキストテキストテキストテキストテキストテキストテキスト

任意の文字

黒い枠BOXテキストテキストテキストテキストテキストテキストテキスト

任意の文字

赤い枠BOXテキストテキストテキストテキストテキストテキストテキスト

黒色ソリッドなBOXテキストテキストテキストテキストテキストテキストテキスト

上下に2本線BOXテキストテキストテキストテキストテキストテキストテキスト

グラデーションで素敵なBOXテキストテキストテキストテキストテキストテキストテキスト

ここにタイトル

タイトル部分が内側BOXテキストテキストテキストテキストテキストテキストテキスト

ここにタイトル

タイトルが上部中央にあるBOXテキストテキストテキストテキストテキストテキストテキスト

表組はシンプル

th th1 th3
td### td1### td2###
td### td1### td2###

バルーン表示

CHECK!

ボタン表示

BUTTON

ヨメレバ・カエレバは目立つように