MENU

CSSテスト記事(本文要素サンプル)

目次

CSSテスト記事(本文要素の総合サンプル)

この投稿は、太字斜体ハイライト小さめ文字inline code⌘Kなどの表現を確認するためのサンプルです。

リンク例:外部リンク / 内部リンク / ページ内アンカー


見出し(H3)と本文の間隔

  • 箇条書き1
  • 箇条書き2
    • ネストA
    • ネストB
  • 箇条書き3
  1. 手順1
  2. 手順2
  3. 手順3

引用:一次情報を取りに行く、という姿勢が品質を決めます。

— Sample

コードブロック(pre/code)

def hello(name):
    return f"hello {name}"

print(hello("world"))

テーブル

項目説明備考
価格月額/年額税込表示
精度誤変換の少なさ辞書対応
速度処理の速さ同時実行
表のキャプション例
サンプル画像(テーマ内SVG)
画像キャプション例(figure/figcaption)

埋め込み(iframe / video)

ボタン(Gutenberg + SWELL想定クラス)

レイアウト(カラム/グループ)

左カラム:短いテキストとリンク

右カラム:強調code

グループ内:余白・背景・境界の挙動を見るための領域です。

SWELLっぽい要素(CSS対象の仮サンプル)

Q. これはFAQの見た目ですか?
A. CSS確認用に、クラスだけ用意しています。
ふきだし(CSS確認用)
キャプションボックス見出し(CSS確認用)

以上。ここまでで本文に出やすいHTML要素を概ね網羅しています。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

CAPTCHA


目次