cssカスタマイズ

2018年08月19日

display:flex;

　s側の線・・・開始線／start　　　e側の線・・・終了線／end


row row-reverse column column-reverse
nowrap ｓ　主軸→
　┏━━━
交┃①②③┃
差　━━━┛
軸　　　　　ｅ
↓ 　　←主軸　ｓ
　　━━━┓
　┃③②①┃交
　┗━━━　差
ｅ　　　　　軸
　　　　　　↓ ｓ　交差軸→
　┏━
主┃①┃
軸┃②┃
↓┃③┃
　　━┛
　　　　ｅ 　　　　ｅ
　　━┓
↑┃③┃
主┃②┃
軸┃①┃
　┗━
ｓ　交差軸→
wrap ｓ　主軸→
　┏━━━
交┃①②③┃
差┃④⑤⑥┃
軸┃⑦⑧⑨┃
↓　━━━┛
　　　　　　ｅ 　　←主軸　ｓ
　　━━━┓
　┃③②①┃交
　┃⑥⑤④┃差
　┃⑨⑧⑦┃軸
　┗━━━　↓
ｅ ｓ　交差軸→
　┏━━━
主┃①④⑦┃
軸┃②⑤⑧┃
↓┃③⑥⑨┃
　　━━━┛
　　　　　　ｅ 　　　　　　ｅ
　　━━━┓
↑┃③⑥⑨┃
主┃②⑤⑧┃
軸┃①④⑦┃
　┗━━━
ｓ　交差軸→
wrap-reverse 　　　　　　ｅ
↑　━━━┓
交┃⑦⑧⑨┃
差┃④⑤⑥┃
軸┃①②③┃
　┗━━━
ｓ　主軸→ ｅ
　┏━━━　↑
　┃⑨⑧⑦┃交
　┃⑥⑤④┃差
　┃③②①┃軸
　　━━━┛
　　←主軸　ｓ 　←交差軸　ｓ
　　━━━┓
　┃⑦④①┃主
　┃⑧⑤②┃軸
　┃⑨⑥③┃↓
　┗━━━
ｅ ｅ
　┏━━━
　┃⑨⑥③┃↑
　┃⑧⑤②┃主
　┃⑦④①┃軸
　　━━━┛
　←交差軸　ｓ

posted by templayer at 14:36 | Comment(0) | TrackBack(0) | css

1 2 3 4 5 .. 最後へ

国内旅行・国内ツアー JR＋宿泊セットプラン国内ホテル・旅館宿泊予約高速・夜行・深夜バスレンタカー観光クーポン海外ツアー・海外旅行海外航空券＋ホテル海外航空券・格安航空券海外ホテル・格安ホテル

国内旅行国内ツアー国内航空券レンタカー高速バス海外旅行海外ツアー海外航空券海外レンタカー・鉄道海外ホテルトラベルサポート割引クーポン懸賞広場観光案内ランキング

display:flex; filter: 　blur(); 　brightness(); 　contrast(); 　grayscale(); 　hue-rotate(); 　invert(); 　opacity(); 　saturate(); 　sepia(); linear-gradient() ①位置指定なし ②位置指定あり ③方向指定 repeating-linear-gradient()

アコーディオン開閉パネル　簡易版開閉パネル　詳細版開閉パネル　改良版絞り込み指定光と色の三原色旭日旗 Z旗日章旗　日の丸画像素材

	row	row-reverse	column	column-reverse
nowrap	ｓ　主軸→ 　┏━━━ 交┃①②③┃ 差　━━━┛ 軸　　　　　ｅ ↓	←主軸　ｓ　　━━━┓ 　┃③②①┃交　┗━━━　差ｅ　　　　　軸　　　　　　↓	ｓ　交差軸→ 　┏━ 主┃①┃ 軸┃②┃ ↓┃③┃ 　　━┛ 　　　　ｅ	ｅ　　━┓ ↑┃③┃ 主┃②┃ 軸┃①┃ 　┗━ ｓ　交差軸→
wrap	ｓ　主軸→ 　┏━━━ 交┃①②③┃ 差┃④⑤⑥┃ 軸┃⑦⑧⑨┃ ↓　━━━┛ 　　　　　　ｅ	←主軸　ｓ　　━━━┓ 　┃③②①┃交　┃⑥⑤④┃差　┃⑨⑧⑦┃軸　┗━━━　↓ ｅ	ｓ　交差軸→ 　┏━━━ 主┃①④⑦┃ 軸┃②⑤⑧┃ ↓┃③⑥⑨┃ 　　━━━┛ 　　　　　　ｅ	ｅ　　━━━┓ ↑┃③⑥⑨┃ 主┃②⑤⑧┃ 軸┃①④⑦┃ 　┗━━━ ｓ　交差軸→
wrap-reverse	ｅ ↑　━━━┓ 交┃⑦⑧⑨┃ 差┃④⑤⑥┃ 軸┃①②③┃ 　┗━━━ ｓ　主軸→	ｅ　┏━━━　↑ 　┃⑨⑧⑦┃交　┃⑥⑤④┃差　┃③②①┃軸　　━━━┛ 　　←主軸　ｓ	←交差軸　ｓ　　━━━┓ 　┃⑦④①┃主　┃⑧⑤②┃軸　┃⑨⑥③┃↓ 　┗━━━ ｅ	ｅ　┏━━━ 　┃⑨⑥③┃↑ 　┃⑧⑤②┃主　┃⑦④①┃軸　　━━━┛ 　←交差軸　ｓ