ブログネタ

クラシックエディタ タグ見本⑤ レイアウト

タグ見本⑤レイアウト
スポンサーリンク
こたすけ
こんにちは!ブログを始めて1か月半のこたすけです。

クラシックエディタにあるタグって種類が多くて、

どれを使ったらいいのか迷っちゃいますよね。

グーテンベルクにも同じ機能がありますが、

クラシックエディタの方がそのまま使えるものが多いし、

ワードプレスを始めたての人におすすめです。

こんな方におすすめ

  • ワードプレス初心者の人
  • 一つ一つ試している時間がもったいない人、一覧を見たい人
  • 普段同じタグばかり多用していてマンネリ気味の人

記事に載せている見本はタグ挿入時のデフォルトです。

タグ内のコードを変更すれば、色やフォントサイズなどを変えることができます。

この記事はレイアウト見本です。

その他のタグについてはコチラからどうぞ。

スポンサーリンク

レイアウト

全サイズ

レイアウトを視認しやすくするため、文字の背景に色を追加しています。

(30%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(70%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

 

(50%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(50%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

 

(左右free)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(左右free)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

  • 横並びコンテンツ(均等)
  • 横並びコンテンツ(均等)
  • 横並びコンテンツ(均等)

PCとTablet 3分割(959px以上)

(33%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(33%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(33%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

 

(30%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(70%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

 

(70%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(30%)※モバイル(599px以下)ではこちらが上になりますダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

 

(40%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(60%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト



(60%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(40%)※モバイル(599px以下)ではこちらが上になりますダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

 

(50%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

(50%)ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト

DIV

DIVに関して詳しく説明されている方がいらっしゃいます。

コチラをどうぞ。

背景ワイド

背景ワイド

タブ切り替えボタン・タブ




タブ1のコンテンツ

タブ2のコンテンツ






タブ1のコンテンツ

タブ2のコンテンツ

タブ3のコンテンツ







タブ1のコンテンツ

タブ2のコンテンツ

タブ3のコンテンツ

タブ4のコンテンツ





タブ1のコンテンツ

タブ2のコンテンツ






タブ1のコンテンツ

タブ2のコンテンツ

タブ3のコンテンツ


タイムライン

■基本


  • ここに見出しテキスト

    ここにコンテンツ


  • ここに見出しテキスト

    ここにコンテンツ


  • ここに見出しテキスト

    ここにコンテンツ


■センター


  • ここに見出しテキスト

    ここにコンテンツ


  • ここに見出しテキスト

    ここにコンテンツ


  • ここに見出しテキスト

    ここにコンテンツ


■基本(ステップ)


  • step.1

    ここにコンテンツ


  • step.2

    ここにコンテンツ


  • step.3

    ここにコンテンツ


■ブログカード

タイムライン(カウント)

■基本


  • ここに見出しテキスト

    ここにコンテンツ


  • ここに見出しテキスト

    ここにコンテンツ


  • ここに見出しテキスト

    ここにコンテンツ


■センター


  • ここに見出しテキスト

    ここにコンテンツ


  • ここに見出しテキスト

    ここにコンテンツ


  • ここに見出しテキスト

    ここにコンテンツ


■ブログカード(カウント)


最後までご覧頂きありがとうございます。

これでよししは雑記ブログです。

他の記事も良かったら見ていって下さいね。

スポンサーリンク
  • この記事を書いた人

こたすけ

グンマーに魅了された埼玉っ子。 美味しいもの大好きで、可愛いもの、新しいものに目が無い、これよしし!のギター担当。お仕事はRFエンジニア。 よししと一緒にブログネタやぐんま情報を発信してます。

-ブログネタ
-

© 2022 これでよしし