Han Shuping の最新 CSS3 ビデオ チュートリアル ソース コード コースウェア

「Han Shuping の 2016 最新 CSS3 ビデオ チュートリアル」は、より良い結果を達成するために css2 テクノロジーに基づいてアップグレードされた新しい CSS テクノロジーである css3 の技術的な説明です。 CSS3 は CSS テクノロジーのアップグレードされたバージョンであり、CSS3 言語開発はモジュール化に向けて発展しています。それを小さなモジュールに分割します。これらのモジュールには、ボックス モデル、リスト モジュール、ハイパーリンク メソッド、言語モジュール、背景と境界線、テキスト効果、複数列レイアウトなどが含まれます。

コース再生アドレス: //m.sbmmt.com/course/441.html

先生の教え方:

先生の講義は鮮やかで機知に富み、機知に富んでいて、感動。鮮やかな比喩は最後の仕上げのようなもので、生徒に知恵への扉を開きます。適切に配置されたユーモアは、まろやかなワインを飲むように、人々に後味と郷愁を与え、哲学者の格言や文化への言及をもたらします。ナレーションの中に時々散りばめられ、人々に考えさせ、警告を与えます。

このビデオのより難しい点は、CSS3 でのインライン ボックスの挿入です。

CSS3 で導入されたレイアウト モードは、Flexbox レイアウトです。主なアイデアは、コンテナにそのサブ項目を変更できるようにすることです。幅と高さを調整し、可能な限りスペースを埋めます。 Flex コンテナは、Flex アイテムを使用して、利用可能な空き領域を埋めるために自動的に拡張および縮小します。
さらに重要なのは、従来のレイアウト（上から下へのブロックレベル、左から右へのインライン）とは異なり、Flexboxのレイアウト方向は予測不可能であり、ページレイアウトには適していますが、大規模または複雑なアプリケーションのサポートには適していません。柔軟性の欠如。
通常のレイアウトがブロックとインラインのテキストフローの方向に基づく場合、フレックスレイアウトは「フレックスフロー」の方向に基づきます。まず、伸縮ボックス モデルの特別な用語をいくつか理解しましょう。

スピンドル: Flex コンテナーの主軸は、主に Flex プロジェクトを構成するために使用されます。必ずしも水平である必要はなく、主に fle-direction 属性に依存します。
スピンドル開始点、スピンドル終了点: Flex プロジェクトの構成は、コンテナーの主軸開始エッジから始まり、主軸終了点で終了します。
主軸の長さ: Flex プロジェクトの主軸方向の幅または高さは、Flex プロジェクトの主軸の長さ属性であり、どちらかによって決まります。主軸方向を向いています。
側軸：主軸に垂直な軸を側軸といい、側軸方向の延長です。
交差軸開始点、交差軸終了点: 伸縮列の構成は、コンテナの交差軸開始エッジから始まり、交差軸終了点で終了します。
軸交差の長さ: Flex プロジェクトの軸交差方向の幅または高さがプロジェクトの軸交差の長さです。Flex プロジェクトの軸交差の長さ属性は、widht 属性または height 属性です。どちらが主軸方向を向いているかで決まります。

Flex レイアウトの構文仕様はここ数年で大幅に変更されており、これにより Flexbox の使用にも一定の制限が生じています。構文仕様のバージョンが多く、ブラウザのサポートが一貫していないため、Flexbox レイアウトはあまり使用されていません。 。 Flexbox レイアウトの構文仕様は主に 3 種類に分かれます。

ここでは、ソース コード リソースをダウンロードすることをお勧めします: //m.sbmmt.com/xiazai/learn/2127

リソースはビデオ コースウェアとソース コードを共有します

以上がHan Shuping の最新 CSS3 ビデオ チュートリアル ソース コード コースウェアの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。