ピュアチャ〜ジ

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

Webデザイン勉強60日目の成長報告!

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


[ピュアチャ〜ジ]

どうもこんにちは!

今日も作業を行いました〜

いつの間にか集中できてる時ってないですか?今日はそんな日でした。笑

 

 

今日の作業進捗報告です!

 

【模写したHP】

今日は新着情報〜フッターまでを作成しました

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

 

【HTML】

こんな感じです。今日は超シンプル。

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

 

【CSS1〜left編〜】

padding 10px(上下左右)を設定し、width,heightを20pxずつ削っています。

これポイントですね。忘れないように気をつけます。

 

h3タグ入力していましたが、存在しないですね、、、怖い。無視してください笑

 

overflowは忘れてましたので復習できてよかったです!

overflow: scroll;

width: ●●;

height: ●●;

 

line-heightを行間のpxと同じ数を設定することで、文字を行間の中央揃えにできることがわかりました!

span属性も発見でした。最初、dlタグかと思ったんですが<span>で囲むことで同じ行に記述しつつも別の指示を出せるコードとして記述できました!

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

CSS〜right編〜】

これは見た通りですね!

なんか最初画像がうまく表示されなくてわけわかめでしたが、どっかの記述が間違ってたようで、2.3回打ち直したら綺麗に表示されました。1文字とかの違いってなかなかみつけられないですよね。笑

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

 

CSS〜フッター編〜】

フッター編も結構わかりやすいコードで、これは一瞬でした。

 

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

 

 

今日も作業を行いまして、今日で60日継続!

 

 

毎日の継続ってすばらしいなぁ

いやな日があっても継続することで、絶対毎日向上してますね。

 

2ヶ月が経ったので、今後の直近の予定を見直して再度プランを組み立てようと思います

 

今日は、ここまで!