テンプレート
見出しh2
見出しh3
見出しh4
テキストテキストテキスト.t1
テキストテキストテキスト.t2
テキストテキストテキスト.t3
テキストテキストテキスト.t4
TEXTTEXTefont
代表者OOOOOO.明朝体
ストロングテキスト
テキストテキストテキスト
- チェックリストチェックリスト
- チェックリストチェックリスト
- チェックリストチェックリスト
テーブル
フォーム
会社名 | |
---|---|
代表取締役 | |
設立 | |
事業案内 |
レスポンシブ
セル内の折り返しをしない
項目 | 詳細テキストテキスト |
---|---|
項目 | 詳細テキストテキスト詳細テキストテキスト |
項目 | 詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト |
項目 | 詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト |
項目 | 詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト |
一番上の行と左端のthだけ折り返ししない
項目項目項目 | 項目項目項目 | |
---|---|---|
項目 | 詳細テキストテキスト詳細テキストテキスト | 詳細テキストテキスト詳細テキストテキスト |
項目 | 詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト | 詳細テキストテキスト詳細テキストテキスト |
項目 | 詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト | 詳細テキストテキスト詳細テキストテキスト |
項目 | 詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト詳細テキストテキスト |
ヘッダー付き
コース名 | コース詳細 |
---|---|
ライトコース | 26時間のライトコースです。26時間のライトコースです。 |
スタンダードコース | 48時間のスタンダードコースです。48時間のスタンダードコースです。 |
プロフェッショナルコース | 80時間のプロフェッショナルコースです。80時間のプロフェッショナルコースです |
マンツーマンレッスン | 単発の完全マンツーマンレッスンです。単発の完全マンツーマンレッスンです |
出張研修・コンサルティング | お客様先で行う出張研修・コンサルティングです。お客様先で行う出張研修・コンサルティングです |
コース名 | コース詳細 |
---|---|
ライトコース | 26時間のライトコースです。26時間のライトコースです。 |
スタンダードコース | 48時間のスタンダードコースです。48時間のスタンダードコースです。 |
プロフェッショナルコース | 80時間のプロフェッショナルコースです。80時間のプロフェッショナルコースです |
マンツーマンレッスン | 単発の完全マンツーマンレッスンです。単発の完全マンツーマンレッスンです |
出張研修・コンサルティング | お客様先で行う出張研修・コンサルティングです。お客様先で行う出張研修・コンサルティングです |
カード(元パネル)
今までのパネルに近い
テキストテキストテキストテキストテキストテキストテキストテキスト
タイトルタイトルタイトルタイトル
テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
新しい例
申し訳ございません。
ただいま準備中につき、大変ご迷惑をおかけしております。
もうしばらくお待ちください。
colブレイクポイント
「-n」の「n」は数字が入ります。
今まで通り1~12で指定。
今までと大体同じところでレイアウトの切り替えをするとしたら、
col-xs-n=col-n
col-sm-n=col-md-n
col-md-n=col-lg-n
で使うのが今までの感覚と一番近いかと思います。
全幅適用
col-n
col-6
col-6
576px以上適用
col-sm-n
col-sm-6
col-sm-6
768px以上適用
col-md-n
col-md-6
col-md-6
992px以上適用
col-lg-n
col-lg-6
col-lg-6
1200px以上適用
col-xl-n
col-xl-6
col-xl-6
表示順変更
今まで
.col-md-8.col-md-push-4 .col-md-4 col-md-pull-8
新しい表示順変更
.col-md-8.order-md-2 .col-md-4.order-md-1
ストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト
row、colの左右のmargin、paddingを無くしたいとき
「row」に「no-gutters」を追加します。
今まで「cs_row」で作っていたようなレイアウトが作成できると思います。
左右の間隔がなくなり横の要素とくっつきます。左右の間隔がなくなり横の要素とくっつきます。
左右の間隔がなくなり横の要素とくっつきます。
左右の間隔がなくなり横の要素とくっつきます。
リンク
タイムライン
-
2007年2月
テキストテキスト
コメントコメントコメントコメントコメントコメントコメントコメント
-
2007年2月
テキストテキスト
コメントコメントコメントコメントコメントコメントコメントコメント
-
1968年8月
コメントコメントコメントコメントコメントコメントコメントコメント
-
1968年8月
コメントコメントコメントコメントコメントコメントコメントコメント
-
1968年8月
コメントコメントコメントコメントコメントコメントコメントコメント
-
1968年8月
コメントコメントコメントコメントコメントコメントコメントコメント
-
1968年8月
コメントコメントコメントコメントコメントコメントコメントコメント