月別: 2019年10月

タイトルの横に”Album”というのを入れました。細かい設定。
Pタグでtypeというクラスをつける。
スタイルを調整。
inline要素にしないとPタグはブロック要素なので行全体が赤く染まる。↓inline要素にしてあげてその要素の幅だけに効くようにしてあげる。

c.sakyou

imgと説明文をdivタグで囲み、descriptionというクラスをつけ、CSSでimgが説明文の左にくるようにfloatにて整える。

description imgと細かく設定したのは、これからimgを指定する際に全てに適用しないようにするため。

いい感じ。

c.sakyou

教材で配布されている画像を、新しく作ったファイルの中に保存する。そのファイルを指定して画像を貼りつける。

Pタグでアルバムの説明文を記入。一行目、二行目、3行目をそれぞれの段落で分ける。

あっという間にここまでできました

c.sakyou

前回に出てきたbox-shadowについて、使い方がよくわからなかったので、復習してみる。

例：box-shadow: 0 0 0 0 rgba(0,0,0,0.4);

１番目は水平方向の影。（正は右方向へ、負は左方向へ）
2番目は垂直方向の影。（正は上方向へ、負は下方向へ）
３番目はぼかし距離。（数が大きくなるほどぼかしが強くなる。０だとくっきり）
４番目は広がり距離。（正は全方向に拡大、負は縮小）

rgbaは色の指定。
最後にinsetと記載すると、影はボックスの内側へ反映される。

いくつか試しにやってみました、なんとなくわかったかな〜

c.sakyou

divタグの枠のスタイル調整。

header部分
背景色を濃い茶色、文字色を白に設定。
文字を中央へ配置。

注意：h1と書いてしまうと、セクションタグのh1も中央に配置されてしまう。今回はheaderのh1のみ中央に配置したいため、タグ名を指定してあげる。

ここまでできました。

c.sakyou

背景や文字の色、サイズ、のスタイルを整える。
黒すぎる文字は見にくくなるそうなので少しグレーだそうです（余談）
まだまだ途中ですね、完成はまだ先。

c.sakyou

アーティスト名とアルバム名どちらも大見出しとして使用したいが、同じセクションでh１が二つあるのは変なので、セクションを分けてあげる。
この場合、アーティスト名はheaderタグに入れ、アルバム名はセクションタグ（informationというクラスをつける）の中に入れる。

c.sakyou

udemyレッスン第二章。
アルバムの紹介ページを作るの巻。

基本的な部分を書きました。

c.sakyou

メールアドレス、パスワードの隣にある必須という文字を入れる。それだけでスタイルを調整していきたいので、インライン要素であるスパンタグで囲み、requiredというクラスをつける

あとはCSSでスタイルを調整し、背景色を薄いグレーにしたら完成！

やっと第1章が終わったな、、もう少し時間をとって進みをよくしたいというのが課題です。。

c.sakyou

監督ご指導につき、googleアナリティクスを導入してみた。

むむ。入れてみたはいいものの使い方わからん。と少し調べてみた。基本中の基本。

セッション数：サイトに何回の訪問があったか？
ユーザー数：サイトに訪問したユーザー数
ページビュー数：サイトの中で見られたページ数
ページ/セッション：1回の訪問につき、何ページ見られたか
平均セッション時間：1回訪問につき何分滞在しているか
直帰率：1ページだけ見て帰ったユーザーの割合
新規セッション率：新しく訪問してくれたユーザーの割合

他にも、どの地域の人がみているか、モバイルかPCか、男性女性等統計がでてくるようです。

調べてみると面白い。複雑な使い方はまた今度。
数字で出てくると面白いですね〜

c.sakyou