ピュアチャ〜ジ

広告代理店のディレクターを辞め、マレーシアに飛び立ちました。ふわふわ生活して、やっぱり収入を上げて豊かに人生にしたい!と思いプログラミング学習を始めました!フリーランスまでの道のりを描くブログです

webデザイン勉強83日目の成長報告!

こちらのWebサイトは移転しました。


[ピュアチャ〜ジ]

はいどうも!

本日も作業を積み上げました。

 

【作ったHP】

f:id:terushi-diary:20191112191539p:plain

f:id:terushi-diary:20191112191544p:plain

f:id:terushi-diary:20191112191552p:plain

【打ち込んだコード】

f:id:terushi-diary:20191112191605p:plain

f:id:terushi-diary:20191112191612p:plain

f:id:terushi-diary:20191112191620p:plain

f:id:terushi-diary:20191112191637p:plain

f:id:terushi-diary:20191112191642p:plain

f:id:terushi-diary:20191112191650p:plain

 

 

一つ一つ解説するとすごい時間がかかりそうなので省こうと思います。

今日学習したことは、各コード自体は難しくないのですが「どういう構造にして組み立てるか」というところがポイントだと感じました。

 

今回だと以下です。

 

1.一番上の要素はヘッダーとして定義する

2.上下にある「ダウンロード」のボタンに共通のCSSをかけるため、複数の要素を一つのclassに設定する

3.classで区切るごとに、h1やh2を設定してOK

4.section>div>section(複数) という風に、表現をするために複数の目印を使ってOK

 

 

今日は、ここまで。