[大邱AI学校]1.08.18開発日記

1488 ワード
大邱AI学校 VS Code CSS Naveraudio-clipコピー猫 html テキストリンク

□NAVERオーディオクリップ3/3


★コード作成


Git LinkNAVERオーディオクリップ

1.オーディオクリップのメイン右側領域


●display: inline-blockの状態ではmargin: 0 auto;(x軸中央揃え)は適用されず、display: blockに変更すること
●結果スクリーンショット(人気チャンネル紹介&本日の発見)

●結果スクリーンショット(オーディオクリップ紹介)

2.オーディオクリップのメイン下部領域


●結果スクリーンショット

3.オーディオクリップカテゴリ領域


●nth-child()使用方法
①liラベルのうち奇数liラベルのみ適用(odd)
例)
.audio-category .audio-category-lists .category-list:nth-child(odd) a {
    background-color: green;
}
②liラベルのうち偶数liラベルのみ適用(even)
例)
.audio-category .audio-category-lists .category-list:nth-child(even) a {
    background-color: blue;
}
●結果断図(カテゴリ領域主)

□難点


特に難しい内容はありません

□解決方法


カリキュラムに基づいてコードを作成し、必要に応じてコードを変更しました.

□勉強心得


どの部分がパブリックエリアであり、どの部分がCSSコードを記述する必要があるかを徐々に理解しています.
Javascript_ Promise()
BOJ 1759パスワードの作成