ページ
- 109件ヒットしました。全11ページ中9ページ目を表示しています。
メソッドの使用例
解説はこちら。 See the Pen Bootstrap4ツールチップのメソッドの使用例 by cccabinet (@cccabinet) on CodePen.
その他の使用例
ツールチップが複数行に渡る場合 ●デフォルト See the Pen Bootstrap4複数行に渡るツールチップ by cccabinet (@cccabinet) on CodePen. ●white-space:nowrap 付き See the Pen ツールチップが複数行に渡る場合 by cccabinet (@cccabinet) on CodePen. ※bootstr...
概要
コンテナ(Containers) これらのSassループもカラーマップに限定されない。コンポーネントのレスポンシブバリエーションも生成可能。例えばドロップダウンのレスポンシブな配置を例にとった場合、$grid-breakpoints Sassマップの @each ループとメディアクエリの組み合わせが混在している。 Bootstrapには3つの異なるコンテナがある。 .container は、...
グリッド
使い方(How it works) Bootstrapのグリッドシステムは、一連のコンテナ、行、列を使用して、コンテンツのレイアウトと配置をする。これはFlexboxで構築され、完全にレスポンシブになる。以下は、グリッドがどのように組み合わされるのかを示す例と詳細である。 Flexboxに慣れ親しんだり、馴染みがないのなら、背景、用語、ガイドライン、コードスニペットについては、こちらのCSS T...
レイアウトユーティリティ
display を変更(Changing display) display プロパティの一般的な値をレスポンシブで切り替えるには、表示ユーティリティを使用。グリッドシステム、コンテンツ、コンポーネントと組み合わせて、特定のビューポートで表示か非表示にする。 Flexboxのオプション(Flexbox options) Bootstrap4はFlexboxで構築されているが、不必要な...
box-shadow スタイルを有効にする
Bootstrap4の $enable-shadows を有効にした場合に変更される主なCSSスタイル。 $enable-shadows を有効にする方法 ツールのセットアップを実行。 Bootstrap4のソースファイルの /scss/_variables.scss の Options の項目にある$enable-shadows: false !default; を ...
グラデーションを有効にする
Bootstrap4の $enable-gradients を有効にした場合に変更される主なCSSスタイル。 $enable-gradients を有効にする方法 ツールのセットアップを実行。 Bootstrap4のソースファイルの /scss/_variables.scss の Options の項目にある$enable-gradients: false !defau...
border-radius スタイルを無効にする
Bootstrap4の $enable-rounded を無効にした場合に変更される主なCSSスタイル。 $enable-rounded を無効にする方法 ツールのセットアップを実行。 Bootstrap4のソースファイルの /scss/_variables.scss の Options の項目にある$enable-rounded: true !default; を $...
レスポンシブ・フォントサイズを有効にする
Bootstrap4の $enable-responsive-font-sizes を有効にした場合に変更される見出しのスタイル。ビューポイントのサイズを変えるとそれに合わせてフォントサイズが変わる(ビューポイントが1200px以下で有効)。 $enable-responsive-font-sizes を有効にする方法 ツールのセットアップを実行。 Bootstrap4のソースファイルの...
境界ユーティリティ
枠の罫線(Border) 罫線ユーティリティを使用して、要素枠の罫線を追加または削除。すべての罫線から選択するか、一度に1つずつ選択。 罫線を追加(Additive) 罫線の種類 四面全てに線:.border ●一面に線 上部に線:.border-top 右側に線:.border-right 下部に線:.border-bottom 左...