24ブロ

私が未経験からプログラミングを学んだ物語

HTML/CSS(9日目)

みなさんこんばんは

昨日は、結婚式やら何やらで記事書けなかったんですけど、今日もたくさん収穫あったのでここに載せたいと思います(≧∀≦)

まず、昨日待ちに待った中間テスト受けました!

90分のテスト時間。結構時間あるじゃん!と余裕こいて臨んだ結果。。。。。

スーパー撃沈しました。

100点満点中10点ぐらいw

なかなかの出来なさ具合w来週の土曜には本試験(70点以上で合格)あるのになぁ 残でした(@_@)

でも、反省点は明確に見えました。‘どっからわかってないのか’もわかっていなかったので、今回のテストで間違いなく収穫はあったね!🤓

とにかく前に進むしか選択肢ないので、やるしかない! というところで

今日は、徹底的にHTML/CSSの復習しました! ちょうど1週間前に勉強し始めたところから始めたのですが、不思議と結構頭に入ってくる!やっぱり反復は重要だね!

特にfloatやらpositionのあのcontentsが浮く感じ。 HTML/CSSのあの積み木みたいな概念が面白くてもぉ夢中^ ^

あと私的新発見だったんですけど、 paddingっていう領域内の余白を指定するプロパティなんですけど、

padding: 10px 3px 30px 5px; 

 /* 上:     10px のパディング  */
                          
  /* 右:     3px のパディング  */
                            
/* 下:     30px のパディング */
                          
  /* 左:     5px のパディング*/

こうゆうルールがあるんですけど、

padding: 10px auto auto 5px; 


 /* 上:     10px のパディング  */
                          
  /* 右:     auto のパディング  */
                            
/* 下:     auto のパディング */
                          
  /* 左:     5px のパディング*/

これだとどうなると思います?

paddingに似たmarginにはよくauto(自動的に調整)が使われるんですけど、僕はそのノリでこれ書き加えたんです。

でも、画面の構成が一気に崩れたのでなんじゃこりゃってなったんですが、色々ためしてみてわかったんですけど

これなんと、paddingが適用されなくなっちゃうんですね

paddingにauto機能がないから、autoかいちゃうとpaddingが“無”になる

という働きになるみたいです

HTML/CSSってエラーが出ないから自分で色々試してみて、起きた動作から抽象化していく重要性もすごく感じました。 やっぱり頭より手を動かした方が学べますわw

明日はrailsを徹底的に詰めてこう

手を動かしてね(゚∀゚)

おしまい