containers
Containers
コンテナには2つの部分があります。
HTML構造は次のとおりです。
<div class = "container">
<div class = "header"> </div>
<div class = "left"> </div>
<div class = "middle"> </div>
<div class = "right"> </div>
<div class = "footer"> </div>
</div>
CSSはここからダウンロードする必要があります。
各コンテナセクションには、別のコンテナまたはHTMLタグ、フォーム、またはコンポーネントを含めることができます。
コンテナの内側にコンテナセクションからコンポーネントを配置することは避けてください。
各コンテナセクションのデフォルトサイズは次のとおりです。
- ヘッダー：幅：100％、高さ：10％ - 左：幅：10％、高さ：80％ - 中央：幅：80％、高さ：80％ - 右：幅：10％、高さ：80％ - フッター：幅：100％、高さ：10％
クラスを使用して、これらのデフォルトサイズを変更するか、セクションを表示しないようにします。
セクションに表示しないには、これらのクラスのいずれかを使用します。なし、 W00 、 H00 。
別の幅を定義するには、これらのクラスを使用します： W05 、 W10 、 W15 、 W20 、 W25 、 W30 、 W35 、 W40 、 W45 、 W50 、 W55 、 W60 、 W65 、 W70 、 W75 、W80、 W85 、 W90 、 W95 、 W100 。
別の高さを定義するには、これらのクラスを使用します： H05 、 H10 、 H15 、 H20 、 H25 、 H30 、 H35 、 H40 、 H45 、 H50 、 H55 、 H60 、 H65 、 H70 、 H75 、 H80 、 H85 、 H90 、 H95 、 H100 。
クラスの数は、コンテナセクションまたはDivに適用される割合です。
コンテナを使用することは、必要なレイアウトを作成することができます。
コンテナの使用方法を理解するための例をご覧ください。
コンテナには、使用する多くのコンポーネントもあります。それらのいくつかは、フォーマットされるCSSのみを使用しているものもあれば、JavaScriptを使用して自分でアクションを実装するものもあります。
コンポーネントで使用されているアイコンは、Font Awesome Desktopバージョンから取得され、ダウンロードに含まれています。
これらのアイコンは、「FA-」から始まる名前の所有者への帰属としての名前を手動で名前が変更しました：Font Awesome。
あなたは素晴らしいテーマを作成し、私たちのリポジトリにコミットするコンテナに貢献することができます、
寄付（パトレオン）または提案があります。
=========================================================================================== - サポートブラウザ（最小バージョン）[互換性：2020-06-02のグローバル使用ブラウザーの92.73％]： ------------------------------------------------------------- ブラウザ：バージョン：プラットフォーム ------------------------------------------------------------- - クロム：49：PC/MAC - クロム：81：Android - エッジ：16：PC -Firefox：34：PC/Mac -Firefox：68：Android - オペラ：36：PC/MAC - オペラ：46：iOS、Android（Opera Mobile） - サファリ：13.1：Mac - サファリ：13.4：iOS - サムスン：11.1：Android ------------------------------------------------------------- - サポートされているブラウザ？ [不明な互換性：2020-06-02で1.98％]： -UCブラウザ：12.12：Android - サポートされていないブラウザ[互換性がない：2020-06-02で2.70％]： -IE - オペラミニ - QQ 注：最小バージョンはhttps://caniuse.comから取得されました 使用するCSS機能を探しています。 ===========================================================================================
