テンプレート:W3Flex end

[閲覧 | 編集 | 履歴 | キャッシュ破棄]ドキュメント

レスポンシブな表組みテンプレート。
{{w3FlexChild}}を {{w3Flex begin}}...{{w3Flex end}}のあいだで使用すると「名前(name)」と「詳細(detail)」の情報をテーブルのように並べ、さらにそれを横二分割で表示します。
通常の表組みとの違いは、モバイルで表示した際には1列で表示される点です。それ以外のメリットはありません。

使用ページ：システム

パラメーター

w3Flex begin

引数	説明
|style=	スタイルを指定(省略可)
|class=	htmlクラスを指定(省略可)

w3Flex end

引数	説明
なし	なし

w3FlexChild

引数	説明
|name=	名前
|detail=	内容
|name-class=	名前のhtmlクラス(省略可)
|detail-class=	内容のhtmlクラス(省略可)

例

{{w3Flex begin| style=margin:4px 0 | class=w3-card }}
{{w3FlexChild| name=なまえ1 | detail= 詳細}}
{{w3FlexChild| name=なまえ2 | name-class=w3-2021-green-ash | detail= 詳細 | detail-class=w3-metro-light-blue }}
{{w3FlexChild| name=なまえ3 | detail= 詳細}}
{{w3FlexChild| name=なまえ4 | name-class=w3-2021-green-ash | detail= 詳細 | detail-class=w3-metro-light-blue }}
{{w3FlexChild| name=なまえ5 | detail= 詳細}}
{{w3FlexChild| name=なまえ6 | name-class=w3-2021-green-ash | detail= 詳細 | detail-class=w3-metro-light-blue }}
{{w3FlexChild| name=なまえ7 | detail= 詳細}}
{{w3FlexChild| name=なまえ8 | name-class=w3-2021-green-ash | detail= 詳細 | detail-class=w3-metro-light-blue }}
{{w3FlexChild| name=なまえ9 | detail= 詳細}}
{{w3FlexChild| name=なまえ10 | name-class=w3-2021-green-ash | detail= 詳細 | detail-class=w3-metro-light-blue }}
{{w3FlexChild| name=なまえ11 | detail= 詳細}}
{{w3FlexChild| name=なまえ12 | name-class=w3-2021-green-ash | detail= 詳細 | detail-class=w3-metro-light-blue }}
{{w3FlexChild| name=なまえ13 | detail= 詳細}}
{{w3Flex end}}

なまえ1

詳細

なまえ2

詳細

なまえ3

詳細

なまえ4

詳細

なまえ5

詳細

なまえ6

詳細

なまえ7

詳細

なまえ8

詳細

なまえ9

詳細

なまえ10

詳細

なまえ11

詳細

なまえ12

詳細

なまえ13

詳細

w3.cssの色クラス一覧

Template:W3-Color Classes Sample

[閲覧 | 編集 | 履歴 | キャッシュ破棄]上記の記事は次のページから転記しています： テンプレート:W3FlexChild/doc.