メインコンテンツへスキップ

ページ

  • 109件ヒットしました。全11ページ中11ページ目を表示しています。

位置ユーティリティ

共通の値(Common values)v4.0.0新設 位置ユーティリティクラスで迅速に設定可能だが、レスポンシブには未対応。 設定例 コピー<div class="position-static">...</div> <div class="position-relative">...</div> <div class="position-...

スクリーンリーダー

.sr-only でスクリーンリーダーを除くすべてのデバイスで要素を非表示にする。.sr-only と .sr-only-focusable を組み合わせると、要素がフォーカスされているときに再表示する(キーボードのみのユーザーなど)。mixinとしても使用可能。 設定例 スクリーンリーダーを除いて非表示コピー<a class="sr-only" href="#content">メイン...

陰影ユーティリティ

実例(Examples) Bootstrapではコンポーネントの影はデフォルトでは無効になっており、$enable-shadows で有効にすることも可能だが、box-shadow ユーティリティクラスで影を追加または削除可能。.shadow-none と3つのデフォルトサイズ(対応する変数が一致)のサポートを含む。 影の種類 影なし:.shadow-none 小さめの影:.shadow-sm...

サイズユーティリティ

親要素を基準にする(Relative to the parent) 幅と高さのユーティリティは scss/_variables.scss の $sizes Sassマップで生成。デフォルトでは、25%, 50%, 75%, 100%, auto がサポートされている。さまざまなユーティリティを生成する必要がある場合はこれらの値を変更すること。 割合幅の設定(Width) 幅の種類 Width 2...

空白ユーティリティ

使い方(How it works) 可変性に優れた margin や padding 値を、要素またはその周辺のサブセットに簡略なクラスで割り当てる。個々のプロパティ、すべてのプロパティ、垂直方向と水平方向のプロパティのサポートが組み込まれている。クラスは、.25rem から 3rem までのデフォルトのSassマップから構築。   記法について(Notation) xs から xl ...

伸長リンク

リンクに .stretched-link を追加して、 ::after 擬似要素を介して包含ブロックをクリック可能にする。ほとんどの場合、これは position: relative;(相対位置)を持つ要素が .stretched-link クラスとのリンクを含めることで実現可能。CSSの位置がどのように機能するかを考えると、.stretched-link はほとんどのテーブル要素と混在させるこ...

テキストユーティリティ

※HTML5のインライン要素による文字の装飾については文字の体裁に掲載。 文字の配置(Text alignment) 文字をテキスト配置クラスでコンポーネントに簡単に配置させる。 文字の均等割付 見本 Some placeholder text to demonstrate justified text alignment. Will you do the same for me? It's ...

縦の配置ユーティリティ

vertical-alignment ユーティリティで要素の配置を変更する。vertical-alignは、inline, inline-block, inline-table, および表のセル要素にのみ影響することに注意。 .align-baseline, .align-top, .align-middle, .align-bottom, .align-text-bottom, .align-t...

可視性ユーティリティ

可視性ユーティリティで要素の visibility を設定。これらのユーティリティクラスは、 display の値を全く変更せず、レイアウトに影響を与えない。.invisible 要素はまだページ内にスペースを残す。コンテンツは、視覚的にも支援技術/スクリーンリーダーのユーザーにも表示しない。 必要に応じて .visible または .invisible を適用する。 警告 invisibl...

ページ検索

ページ検索フォーム