軽量フレームワークを使ってつくるデモサイト
2カラムをベースに、各フレームワークを利用して、ペラのHTMLでシンプルに作成。
更新日:2022-08-14
floatの解除パターン
回り込みのfloatを解除したサンプル
グリッドシステムのデモサイト
シンプルなレスポンシブ向けのグリッドシステム
flexbox レスポンシブ デモサイト
flexboxでシンプルなレスポンシブ向けのグリッドシステム
見出し2
見出し2のパラグラフ、30文字
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこ
見出し3
見出し3のパラグラフ、35文字
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそ
見出し4
見出し4のパラグラフ、40文字
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてと
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてと
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてと
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてと
見出し5
見出し5のパラグラフ、45文字
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえお
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえお
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえお
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえお
見出し6
見出し6のパラグラフ、50文字
あいうえおかきくけこさしすせそたちつてとなにぬねのあいうえおかきくけこさしすせそたちつてとなにぬねの
あいうえおかきくけこさしすせそたちつてとなにぬねのあいうえおかきくけこさしすせそたちつてとなにぬねの
あいうえおかきくけこさしすせそたちつてとなにぬねのあいうえおかきくけこさしすせそたちつてとなにぬねの
あいうえおかきくけこさしすせそたちつてとなにぬねのあいうえおかきくけこさしすせそたちつてとなにぬねの
見出し2-1
見出し2のパラグラフ、65文字
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえお
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえお
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえお
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえお
見出し3-1
見出し3のパラグラフ、70文字
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこ
あいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこさしすせそたちつてとあいうえおかきくけこ
VenoBox
pre,code,pre+code
pre
.post-title { margin: 0 0 5px; font-weight: bold; font-size: 38px; line-height: 1.2; and here's a line of some really, really, really, really long text, just to see how the PRE tag handles it and to find out how it overflows; }
code
sudo apt update
and here's a line of some really, really, really, really long text, just to see how the PRE tag
pre+code
{% if page.earlier %}Previous article: {{ page.earlier.permalink }}{% endif %}
{% if page.later %}Next article: {{ page.later.permalink }}{% endif %}