v-footer
コンポーネントは、あなたのサイト内のどのページからでもアクセスしたい一般的な情報を表示するために使われます。
確認したいコンポーネントを下から選び、利用できる props、slots、events、functions を確認してください。
コンポーネントに position: absolute を適用します。
コンポーネントをアプリケーション レイアウトの一部として指定します。コンテンツのサイズを動的に調整するために使用されます。この小道具を使用するコンポーネントは、正常に機能するためにv-main
コンポーネントの 外側 に存在する必要があります。application page でレイアウトの詳細を確認できます。注: このpropは自動的にposition: fixed でレイアウト要素に適用されます。この機能は absolute
propを使用して上書きできます。
指定された色をコントロールに適用します。利用できるのは色の名前 (たとえば、success
または purple
) または css 表記の色 (#033
またはrgba(255, 0, 0, 0.5)
) です。colors のページ で、組み込みクラスのリストが確認できます。
コンポーネントにダークテーマを適応します。詳しく知りたい場合は、Material Design documentationのdark themesを参照してください。
コンポーネントに適用される高さを0〜24の範囲で指定します。詳細は、elevation のページで確認できます。
コンポーネントに position: fixed を適用します。
コンポーネントに高さを設定します。
アプリケーションからのツールバーの位置を v-navigation-drawer
で指定します。
コンポーネントにlightテーマを適用します。
コンテンツの高さの最大値を設定します。
コンテンツの横幅の最大値を設定します。
コンテンツの高さの最小値を設定します。
コンテンツの横幅の最小値を設定します。
Removes elevation (box-shadow) and adds a thin border.
Remove all padding from the footer
Designates the border-radius applied to the component. You can find more information on the Border Radius page.
Applies a large border radius on the top left and bottom right of the card.
コンポーネント内で使用するカスタムタグを指定します。
Removes the component's border-radius.
コンポーネントに横幅を設定します。
デフォルトの Vue slot
0 !default;
0 !default;
6px 16px !default;
0px !default;
map-get($rounded, 'xl') $footer-border-radius !default;
0.2s !default;
background-color, left, right !default;
map-get($transition, 'fast-out-slow-in') !default;
以下に、簡単な例から複雑な例まで示します。
absolute
propを指定すると、フッターを親コンテナの一番下に絶対的に配置します。
padless
prop はフッターコンポーネントからデフォルトのパディングをすべて削除します。
フッターコンポーネントは、企業や団体のサイトでよくあるリンクを掲載した下部分になります。
インディゴ色の背景色で、ソーシャルメディアのアイコンとボタンのあるフッターコンポーネントです。
青緑色見出しと、列と行のリンクを含むフッターコンポーネントです。