Dev.note(web) 21.07.23

2655 ワード
大邱AI学校 テキストリンク

NAVERネットコミック例1日目


最初のテキスト



以前と同じように、注意すべき部分だけ整理します.

チェックポイント

  • 長さ属性の相対値と絶対値の混合
    • #webtoon-main .webtoon-main-left .webtoon-carousel .webtoon-carousel-right {
	float: right;
	width: calc(100% - 112px);
}
    必要に応じて、相対値と絶対値を加算または減算して混合して使用できます.コンテンツがテキストの場合、幅は親レイアウトを指定する必要はなく、高さは親レイアウトのサイズを指定する必要があります.文字の内容の幅を100%、高さを内容として自動的に設定しているからかもしれません.
    (html)
<html>
  <body>
    <div class="webtoon-carousel-right">
     hello world
    </div>
  </body>
</html>
(css)
html,body {
    background: blue;
    height:100%;
    padding:0;
    margin:0;
}
.webtoon-carousel-right {
  background-color: yellow;
	float: right;
	width: calc(100% - 112px);
  height: calc(100% - 112px);
}
  • 類省略
    • #webtoon-main .webtoon-main-left .webtoon-carousel .webtoon-carousel-left {}
#webtoon-main .webtoon-main-left .webtoon-carousel-left h2 {}
    クラス名を細かくすると、長さが長くなります.このように長いクラスが積み重なると、すべてのクラスを書くのが長すぎて、中間のクラスを省略することができます.ただし、重複する名前のクラスがある場合、パスが詳細でない場合は誤った属性が付与される可能性があるため、クラス名を短くすることが望ましい.

    学習の心得.


    今でもコードを聞いているような気がするので、一人で書く自信はありません.週末にはコードや連想学習レイアウトをゆっくり練習する必要があります.

    進捗コードリンク


    今日行われた詳細コードは私のgithubリンクにアップロードされます.
    [SUDY-Next Step]第3章開発環境の構築とWebサーバの実践要件
    [TIL] ManyToManyField