9日目
とりあえずProgateのror編part2とHTMLpart2終了、順調に進んでる気がする。
今でさえペース遅いのに、明日から忙しくなるからなあ、それでもやっぱり毎日最低30分は時間とって勉強しないとな。
9日目、本を読むのは飽きてきたし、なんとなく作れそうな気がしてきたので、webサイトを作りながらわからないところは調べるって方向にシフトして、でも知らないことは考えることすらできないだろうから、本でも知識を増やしつつって感じにしようかな。
とりあえずメインはサイト作り。
ってわけでさっそくトップページを作っていってるけど、まず背景がわからん。
本には画像表示には画像をassetsフォルダにおいてimage_tagを使えばよいって書いてるし、Progateにはpublicフォルダにおいてimgタグで表示させればいいって書いてるし。
とりあえずimage_tagでやってみたけど、html内にそのままコード書いたら画像サイズそのままで表示されて、上下には余白、左右は大きすぎってなっちゃってる。
背景はおそらくcssで書いてやったほうがよさそうだけど、background-imgでimage_tagを使う方法がわからないから、とりあえずpublicフォルダに画像を置いてbackground-imgで背景を表示させてみる、、、
できた!がしかし、適当なところでトリミングされている。
しかもブラウザを小さくすれば画像サイズはそのままで左上を基点にトリミングされている。自動で縮小してはくれないだろうか。でもよくよく考えると自動で縮小すれば、ブラウザのアス比がそのままだったときはよいが、そうじゃないときはいびつな形になるのではないか?と思って参考にwebサイトのトップページを閲覧しにいく。
ふむふむ、画像サイズはそのままでスクロールさせられるようにしているのだな。
なんかめんどくさいのでとりあえず後回しにしよう。
とりあえずトップはクリックでサイトに入場できるような仕様にしよう。
アニメーションもつけたいな。とりあえず、いろんなサイトみて参考にすることも大事だな。