# Float

レスポンシブ フロート ユーティリティを使用して、任意のブレークポイントにカスタム フロートを適用します。

# Overview

Float ユーティリティ クラスは CSS float propertyを使用し、現在のビューポート サイズに基づいてフローティングを適用します。

Material Designブレークポイント
デバイスコード種類解像度の範囲
Extra smallxs小型から大型のスマホ< 600px
Smallsm小型から中型のタブレット600px > < 960px
Mediummd大型タブレットからノートパソコン960px > < 1264px*
Largelgデスクトップ1264px > < 1904px*
Extra largexl4k、ウルトラワイド> 1904px*
デスクトップにおけるブラウザスクロールバーの * -16px
仕様

# クラス

クラスでフロートを簡単に切り替えます：

# レスポンシブ

フロートは、ブレークポイント（ビューポート）ごとに適用することもできます。

利用可能なすべてのサポート クラスの一覧を次に示します：

  • .float-left
  • .float-right
  • .float-start
  • .float-end
  • .float-none
  • .float-sm-left
  • .float-sm-right
  • .float-sm-start
  • .float-sm-end
  • .float-sm-none
  • .float-md-left
  • .float-md-right
  • .float-md-start
  • .float-md-end
  • .float-md-none
  • .float-lg-left
  • .float-lg-right
  • .float-lg-start
  • .float-lg-end
  • .float-lg-none
  • .float-xl-left
  • .float-xl-right
  • .float-xl-start
  • .float-xl-end
  • .float-xl-none

準備はできましたか？

Vuetifyのチームが選ぶ関連コンテンツで他の学習トピックに進むか、下のナビゲーション リンクでページ間を移動できます。
GitHub でこのページを編集する
最終更新日:11/12/2024, 6:59:50 AM