![見出し画像](https://assets.st-note.com/production/uploads/images/119098579/rectangle_large_type_2_83210da52f5ded271091e66486d2f1a3.png?width=1200)
【本を見ながら作ってみる】トップページ続きから パート2
はい。10月これやる宣言中のneko.usaです
https://note.com/nekousa/n/n0b73a7fe32eb
皆さんのやさしさに救われて無事トップページ完了。ですが背景画像のカスタマイズというのが書いてあったのでちょっと脱線して遊んでます。
![](https://assets.st-note.com/img/1697473943103-GF2RpNxrmu.png?width=1200)
![](https://assets.st-note.com/img/1697473963161-x6BlaE0xWJ.png?width=1200)
ブレンドモード、ハードライトの指定
![](https://assets.st-note.com/img/1697474010582-CjVUpL50Hk.png?width=1200)
飲み物の色としては違うよねぇ
![](https://assets.st-note.com/img/1697474057762-u7hSsqmr2f.png?width=1200)
![](https://assets.st-note.com/img/1697474166883-nkTFUNHXEs.png?width=1200)
![](https://assets.st-note.com/img/1697476793502-5JkXf3KcWH.png?width=1200)
さて、次はnewsページの作成。
2カラムのレイアウトページ作成。
index.htmlをコピーしてファイル名を変える
![](https://assets.st-note.com/img/1697477327635-r0TvuHlxxD.png?width=1200)
![](https://assets.st-note.com/img/1697477564093-UPi2L64uHH.png?width=1200)
次はfooter部分を作る模様
![](https://assets.st-note.com/img/1697477860992-euoNqefXef.png?width=1200)
![](https://assets.st-note.com/img/1697478278798-eHWG2HGMbc.png?width=1200)
![](https://assets.st-note.com/img/1697478839759-exzByorAzK.png?width=1200)
![](https://assets.st-note.com/img/1697479222238-0z0F2gBME0.png?width=1200)
![](https://assets.st-note.com/img/1697479663760-hEmRlqHp3c.png?width=1200)
![](https://assets.st-note.com/img/1697480100215-SpYphiRAcj.png?width=1200)
![](https://assets.st-note.com/img/1697480118879-fYV0rZ4KM6.png?width=1200)
![](https://assets.st-note.com/img/1697480171073-0UteWGB5YV.png?width=1200)
眠いので今日はここまで
![](https://assets.st-note.com/img/1697480425381-UUylhfzILY.png?width=1200)
やっぱりちゃんとできると嬉しい(´▽`*)
続きはこちらです(^^)/