おしゃれなライオンのように、フロント第2期11 Day

1752 ワード
おしゃれなライオンのように 先端学校 CSS テキストリンク
皆さんこんにちはAydenです
CSS floatとログインページの課題について議論します.
  • float
  • 課題

    • 1. float


    floatは、オフセット要素によってソートされるプロパティです.float: left;float:right;程度で揃えることができます.浮動小数点ソートのフィーチャーでは、次の2つの問題が発生します.


    🤔 1.最初の写真のように、子要素がすべてfloat属性の場合、親は子要素の高さを認識できません!
    🤔 2.2枚目の写真のように、兄弟要素の間でfloatを認識できません!
    注意:兄弟要素がfloatの場合、1番の親要素は子要素の高さを認識できません.兄弟要素の1つがfloatとして指定され、もう1つの要素がない場合、2番目の問題が発生します.
    もちろん、解決策はあります.
    😊 1-1. 親要素にoverflow:hidden;を追加します.
    😊 1-2. 親要素の高さを指定します.
    😊 1-3. 親要素に仮想要素clear:both;を追加します.
    .wrap::after {
        content: "";
        display: block;
        clear: both;
      }
    😊 2-1. 兄弟要素の1つの要素はinline-block;に指定されます.
    😊 2-2. 兄弟要素にclear:both;を追加します.

    2.課題


    初めてピグマ制作の結果を通じて、授業中の報告と感じを教えてくれました.
  • flex-boxは使用しないでください.
    †flex boxの場合は、親ボックスでソートする必要があります.
    並べ替え用の親ボックスが新しく作成されたため、効率が低下します.
    ⟆状況に応じて適宜使用する
  • レイアウトを実装する場合、使用場所を回避します.
    後で追加する要素に影響を与える可能性があります.
    上部と左側などの位置値を指定する必要があります.
  • フィグマ値を参照
    「幅」、「高さ」、「スタイル」のプロパティ値を参照してください.
    位置に関連する属性値を適切に無視します.
    「フィグマ」では、小数点値は参照されません.各ブラウザでは、小数点を切り捨てたり、小数点を切り捨てたりします.
  • シンボルタグ
    e「もっと便利なビニブへようこそ.」タイトルだと思ったらh1ラベルもぴったりです.
    タイトルでない場合は2479142ラベルを単独で作成し、IRテクノロジーを使用すると、ウェルカム語は2479142であるべきです.
  • レベルのネーミング
    クラスをすべてのe要素に割り当てた後、必要なクラスのみを使用して、使用しないクラスをHTMLから削除します.
    仕事が見つかったら、会社の会議について名前をつけます.
    学習の中で自分の規則を制定しなければならない.(形式-意味=txt-login)
    • 未完成掃雷ロジック
    白駿Baekjoon 1371号で一番多い字-JAVA