ダークモード

※モバイル機器のみ有効→PC表示に切替 モバイル表示に切替

DarkMode確認用-独自の囲み枠

囲み枠(SIRIUS標準)

先にSIRIUS標準の囲み枠です。

(※テキスト例文は川端康成著『伊豆の踊子』冒頭部分から引用)

 

通常枠

<div class="nmlbox">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

通常枠(灰色背景)

<div class="nmlbox graybg">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

点線枠

<div class="dottbox">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

点線枠(灰色背景)

<div class="dottbox graybg">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

灰色背景

<div class="graybg">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

黄色背景

<div class="ylwbox">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

角丸枠1(灰色線+灰色背景)

<div class="rnd1 rbox1">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

角丸枠2(オレンジ太線)

<div class="rnd1 rbox2">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

角丸枠3(シャドウ枠)

<div class="rnd1 rbox3 shadow2">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

角丸枠4(灰色背景)

<div class="rnd1 rbox4">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

角丸枠5(灰色線+灰色背景+シャドウ)

<div class="nd1 rbox1 shadow1">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

囲み枠(Volar)

続いて【Volar】【Volar】独自の囲み枠をご紹介します。

こちらはアイコンをクリックして一発入力というわけにはいかないので、よく使うモノに関しては文字装飾クラスの設定などにクラスを登録してご利用ください。

 

ただし「タイトル付き」や「和紙風」「ちぎったメモ用紙風」「黒板風」など、コードが複数行にまたがる一部の囲み枠は上記の機能が使えない場合があります。

 

その場合はシンプルにコードをコピー&ペーストしてお使いください。

 

『文字装飾設定』についてはこちら↓の記事にまとめてあります。

SIRIUS(シリウス)の文字装飾設定 - SIRIUSでホームページ作成

SIRIUS(シリウス)の文字装飾設定をご紹介します。

 

『クラスの設定』についてはこちら↓の記事にまとめてあります。

SIRIUS(シリウス)のクラスの設定 - SIRIUSでホームページ作成

SIRIUS(シリウス)のクラスの設定の使い方をご紹介します。

 

二重枠

※サイトカラーと連動

<div class="kakomi_double">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

二重枠(角丸バージョン)

※サイトカラーと連動

<div class="kakomi_double_kadomaru">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

布風

背景が布地風の囲み枠になります。

 

背景:ブルー

<div class="kakomi_nuno_blue">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
の着物に袴をはき、学生カバンを肩にかけていた。

 

背景:ピンク

<div class="kakomi_nuno_pink">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

背景:レッド

<div class="kakomi_nuno_red">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

背景:イエロー

<div class="kakomi_nuno_yellow">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

背景:オレンジ

<div class="kakomi_nuno_orange">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

背景:グレー

<div class="kakomi_nuno_gray">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

交差線

※サイトカラーと連動

<div class="kakomi_kousa">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

タイトル付き1

※サイトカラーと連動

<div class="kakomi_title1">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

タイトル付き1(色違いバージョン)

※こちらはタイトル付き1の色違いバージョンになります。

(サイトカラーと連動しません)

 

カラー:ブルー

<div class="kakomi_title1_blue">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:ピンク

<div class="kakomi_title1_pink">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:レッド

<div class="kakomi_title1_red">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:イエロー

<div class="kakomi_title1_yellow">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:オレンジ

<div class="kakomi_title1_orange">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:グレー

<div class="kakomi_title1_gray">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

タイトル付き2

※サイトカラーと連動

<div class="kakomi_title2">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

タイトル付き2(色違いバージョン)

※こちらはタイトル付き2の色違いバージョンになります。

(サイトカラーと連動しません)

 

カラー:ブルー

<div class="kakomi_title2_blue">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:ピンク

<div class="kakomi_title2_red">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:レッド

<div class="kakomi_title2_red">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:イエロー

<div class="kakomi_title2_yellow">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:オレンジ

<div class="kakomi_title2_orange">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:グレー

<div class="kakomi_title2_gray">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

タイトル付き3

※サイトカラーと連動

<div class="kakomi_title3">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

タイトル付き3(色違いバージョン)

※こちらはタイトル付き3の色違いバージョンになります。

(サイトカラーと連動しません)

 

カラー:ブルー

<div class="kakomi_title3_blue">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:ピンク

<div class="kakomi_title3_red">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:レッド

<div class="kakomi_title3_red">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:イエロー

<div class="kakomi_title3_yellow">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:オレンジ

<div class="kakomi_title3_orange">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

カラー:グレー

<div class="kakomi_title3_gray">

<div class="box-title">ここに注目!</div>

(※内容)

</div>

ここに注目!

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

破線

※サイトカラーと連動

<div class="kakomi_hasen">(※内容)</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

付箋

付箋ふせんっぽい雰囲気の見出しにいどうぞ。

 

カラー:ブルー

<div class="fusen_blue">(※内容)</div>

付箋風見出しに使える?

 

カラー:ピンク

<div class="fusen_pink">(※テキスト)</div>

付箋風見出しに使える?

 

カラー:レッド

<div class="fusen_red">(※内容)</div>

付箋風見出しに使える?

 

カラー:イエロー

<div class="fusen_yellow">(※テキスト)</div>

付箋風見出しに使える?

 

カラー:オレンジ

<div class="fusen_orange">(※内容)</div>

付箋風見出しに使える?

 

カラー:グレー

<div class="fusen_gray">(※内容)</div>

付箋風見出しに使える?

 

和紙風

背景が和紙風。

<div class="kakomi_paper">

<p style="margin-bottom:1em;"><span class="tape"></span></p>
(※内容)
</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

ちぎったメモ用紙風

<div class="kakomi_memo">

<p style="margin-bottom:1em;"><span class="masktape"></span></p>
(※内容)
</div>

道がつづら折りになって、いよいよ天城峠が近づいたと思うころ、
雨足が杉の密林を白く染めながらすさまじい早さで麓からわたしを追って来た。

 

私は二十歳、高等学校の制帽をかぶり、
紺飛白の着物に袴をはき、学生カバンを肩にかけていた。

 

黒板風

<div class="kokuban">(※内容)</div>

囲みタイトル

ポイント1

 

ポイント2ポイント2ポイント2ポイント2ポイント2
ポイント2ポイント2ポイント2ポイント2ポイント2
ポイント2ポイント2ポイント2ポイント2ポイント2
ポイント2

 

強調テキスト

  • リスト形式もできる
  • リスト形式もできる
  • リスト形式もできる
  • リスト形式もできる

 

引用

引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文。

 

引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文、引用文。