3月20日（授業日） - hinairo’s diary

○html修正

・navの特性としてはcontainerの要素が含まれている為、containerの中には入れず、navだけで閉じる。

今日までcontainerの中に入れていたから、画面の真ん中ぐらいまでしか表示されなかったnavbarがやっと画面いっぱいまで広がった。

・top-imgのbackground-imgが表示され無いままだったが、heightをautoにしているのが問題だった。autoにした場合0pxとなるので、表示されなかった。今回はCSSにheight:vh-100;として表示された

・VScode画像の反映

今までレンタルサーバーにあげてURLを貼り付けていたが、ファイル作成時にimgフォルダを作成してXDで作成・加工したimgを保存してhtml・CSSで反映すること。

(XDのポートフォリオで画像を選択→ファイル→書き出し→選択したオブジェクト→名前変更・保存先・png→jpgに変更して画質を落とす。※imgのサイズは100kb以下が目安。)

VScodeさわり始めた時にやり方がわからなかったので今までこのやり方をしてなかった。手順は一個づつ踏まなければならない。

全体的に各containerの表示幅がバラバラなのは現時点では見つからずだが、この上記の方法で全ての画像を貼り直したら原因がわかるかもとのこと。

・fontawesomeでとってきた星印の前の意味不明アイコン消去。

検証で見ると擬似要素である::beforeが反映されていた。解決方法としては親となっているdivを消去。意味はサイトの通り、必ずその選択されている要素の前に何かを出力させるというもの。::afterも同じ。

フォーム入力方法下記サイトをみて要修正。

・footerのアイコンもXDで作成可能とのこと。それをhtmlに貼り付ければ問題クリア

また最終のnavがdivの中に入っていた為中央寄せにできず、外に出して修正。

○XDの作成方法

○bootstrapの使い方

○GoogleMAP　APIの実装方法

○paiza

新規問題：平均値の出し方

例：$sum = 170 + 170 + 163 + 188 + 160 + 170; $avg = $sum / 6; echo $avg;

で平均値の計算ができる。