投稿ページの表示サンプルです！
見出し文字
サンプル文字 <h2 class=”idx01 red”> 〜 </h2>
サンプル文字 <h3 class=”idx02 blue”> 〜 </h3>
サンプル文字 <h4 class=”idx03 purple”> 〜 </h4>
サンプル文字 <h5 class=”idx04 pink”> 〜 </h5>
サンプル文字 <h6 class=”idx01 green”> 〜 </h6>
文章サンプル
レンタルサーバーについて
Rental Serverはホームページやブログを開設する時に利用するものですが、どのような観点で選んでいるのでしょうか。 Rental Serverには幾つかの種類があり、それらを比較することが重要、もちろん、価格の比較も重要です。しかし、Rental Serverを利用する目的を明確にして、その目的に合ったサーバーを選ぶことが大切です。 サーバーの利用形態で比較すると共用サーバーと専用サーバーがあります。つまり、一つのハードを複数の利用者で共用するか、一人の専用とするかと言うことです。当然ながら、専用サーバーは高価ですが、他人のプログラムの影響を受けることがありませんから、安定した動作が期待できます。 会社が業務として運用する場合には専用サーバーとした方がいいでしょうが、個人での利用は共用サーバーが一般的です。ハード的には共用サーバーであっても、論理的に複数のサーバーに見せる技術があります。 それがVPSと呼ばれるサービスです。 ← strongタグで囲んでいます。 これは一般の共用サーバーとは異なり、ユーザーから見ると専用サーバーに見えるのです。したがって、OSの入れ替えのような変更でも可能です。提供されるサービスは業者によって異なります。もちろん、サーバーの種類によってもできる範囲が異なっています。 個人の場合はブログやホームページくらいでしょうか。個人経営のOnline Sshopもあるかもしれません。これらは標準的なサービスとなっています。テーブルサンプル
| 商品名 | 商品01 | 商品02 | 商品03 | 商品04 |
|---|---|---|---|---|
| 価 格 | 6,000円(税別) | 6,000円(税別) | 6,000円(税別) | 6,000円(税別) |
| 特 長 | 商品の特徴を記入します。 | 商品の特徴を記入します。 | 商品の特徴を記入します。 | 商品の特徴を記入します。 |
| 備 考 | 国内送料無料 | 国内送料無料 | 国内送料無料 | 国内送料無料 |
※スマホ表示ではスライドします。
リスト表示
<ul> と <ol> のサンプルです。
- リスト表示のサンプルです。
- リスト表示のサンプルです。
- リスト表示のサンプルです。
- 番号付きリスト表示のサンプルです。
- 番号付きリスト表示のサンプルです。
- 番号付きリスト表示のサンプルです。
マーク
<mark> 〜 </mark> で下記のようにハイライトされます。
サーバーの利用形態で比較すると共用サーバーと専用サーバーがあります。つまり、一つのハードを複数の利用者で共用するか、一人の専用とするかと言うことです。当然ながら、専用サーバーは高価ですが、他人のプログラムの影響を受けることがありませんから、安定した動作が期待できます。
チェック画像付きリスト表示
下記のように記述します（文字も大きく表示させています。)
[html]
<!– チェック画像付きリスト表示 –>
<div class="framed-text purple">
<div class="framed-title purple">囲み枠の中に表示させています！</div>
<ul class="check" style="font-size:1.25em;">
<li class="red"><strong>チェック付きリスト表示のサンプルです。</strong></li>
〜
</ul>
</div>
[/html]
- チェック付きリスト表示のサンプルです。
- チェック付きリスト表示のサンプルです。
- チェック付きリスト表示のサンプルです。
- チェック付きリスト表示のサンプルです。
- チェック付きリスト表示のサンプルです。
- チェック付きリスト表示のサンプルです。
- チェック付きリスト表示のサンプルです。
囲み枠付きテキスト
<div class=”framed-text”> 〜 </div> でテキストを枠付き（ボックス囲み）で表示します。
テキストを枠付きで表示します。強調する文章等に利用できます。テキストを枠付きで表示します。強調する文章等に利用できます。
タイトル付き囲み枠テキスト
<div class=”framed-title”> 〜 </div> を枠内に追加すれば、タイトル付き囲み枠になります。
[html]
<!– タイトル付き囲み枠テキスト –>
<div class="framed-text blue">
<div class="framed-title blue">囲み枠の特長</div>
〜
</div>
[/html]
囲み枠の特長
テキストをタイトル付き枠で表示します。強調する文章等に利用できます。テキストをタイトル付き枠で表示します。強調する文章等に利用できます。
表示のサンプル <h6 class=”idx09 red”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 blue”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 green”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 pink”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 brown”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 purple”> 〜 </h6> で指定しています。
表示のサンプル <h6 class=”idx09 grey”> 〜 </h6> で指定しています。
吹き出し
[bln_left color="blue-waku" img="01" name="一郎"]こんな感じの吹き出しになります。吹き出しには、人物や動物の画像を利用できます。利用する画像は管理画面の「カスタマイザー」で事前に登録しておきます。[/bln_left] [bln_right color="green-waku" img="04" name="美咲"]吹き出しについては、下記のページを参考にしてください。
→ https://www.af-partner.net/wpv15-sp/sp1510/theme-functions/30/[/bln_right]
引用サンプル
Rental Serverはホームページやブログを開設する時に利用するものですが、どのような観点で選んでいるのでしょうか。 Rental Serverには幾つかの種類があり、それらを比較することが重要、もちろん、価格の比較も重要です。しかし、Rental Serverを利用する目的を明確にして、その目的に合ったサーバーを選ぶことが大切です。
出典：引用元サンプル
YouTube埋め込み
<div class=”youtube”> 〜 </div> でマークすると、レスポンシブ対応になります。
インスタグラム埋め込み
センタリングは <div class=”insta-center”> インスタグラムの埋め込みコード </div> と設定します。
なお、サイズは style.css の「.insta-center」の値を変更します。
ツイッター埋め込み
センタリングは <div class=”insta-center”> ツイッターの埋め込みコード </div> を利用しました。
【配信開始】『A列車で行こう』のアートディンクと相模鉄道がコラボ！初代『A列車』をアレンジした鉄道会社経営SLG『相鉄線で行こう』 – ファミ通App https://t.co/9jn0i38Dp6
— ファミ通.com (@famitsu) 2018年12月14日
