progateでhtmlとcssについて学ぼう中級編１
こんにちは、初めてのことがいっぱいだと毎日が新鮮。
ぽんきちさんです。
今日は、progateというサイトでhtmlとcssについて学ぼうと思います。
[フリー画像素材] 家電製品, PC / パソコン, ノートパソコン ID:201410032100 - GATAG｜フリー画像・写真素材集 4.0
道場コースもおすすめ
初級編を学んだあとは、
自力でプログラミングしていく「道場編」というものがあります。
押忍！
これ、できる気がしない。。
これは、ひっそりと涙をぬぐいながら一人でやろうと思います。
というわけで、今日からはhtml&css 中級編にチャレンジしたいと思います！
中級編 目標物を確認する
最初は、「こんなデザインにするよ」ということを確認します。
なにこれかっこいい！
こんな画面を作ることができるようになるの？
さすが…中級編…。
中級編 全体のレイアウト
そして終了のお知らせ
全体のレイアウトはこのように作ります。
初級編のところでは「main」のところが３つの「wrapper」で区切られています。
「…ラッパー？」
別のものが頭に浮かんできますが、きっと間違っているはずです。
進みましょう。
初級編で<div class~"header"></div>と習ったタグは
<header></header>と書くといいよ、と教えられます。
ヘッダー、フッターという専用タグがあるらしいです。
書くのが楽になったとほっとする反面、
「なんでも専用のタグにできるの？」という疑問がわいてきます。
top-wrapperはタグになっていないですよね。なんでもというわけではないのでしょうね。
さっそくhtmlを書いていきます。
できた！と思ったらバツ印が。何かと思ったら＝が〜になっていました。
ほかにも、ハイフン（-）でつないでいないとか、
message のeがaになっていたりとかとにかくミスタッチが多い。
これをゼロから書いていくってどんだけ大変なんや！
プログラマー様たちを尊敬します。
ワクワク進めていたら、
残念ながらここから先は有料会員限定ということでした。
無料の範囲は勉強内容を公開させていただきましたが、
さすがに有料部分を公開するわけにはいきません。
というわけで、中級編はここまでになります。
「え、もう終わるの？」
他のレッスンをざっくりご紹介
html&cssのほかにも、いろんな言語の勉強ができます。
すごい！たくさんあるなあ。
次に学ぶとしたらどれだろう…。
そもそも自分に何が必要なのかよくわかりません。
「逃げ恥」の平匡さんはphpをしていたよ、という証言を友人からいただいておりますので
名前を知っているものから学ぶというのもアリかもしれませんね。
不完全燃焼な感じは否めませんが
今日はここで終了いたします（白目）。
