サイドラインズ 
今日ふとウェブサイトを見てたらこの広告が目に止まったんですけどね。
気持ち悪さね。そうね？あるよね？気持ち悪さ。これは気持ち悪いねっていうところがね？
何がわからないかがわかりません！僕はまだ無事転職は出来なそうです！信夫でございます。なんだろう。プロパティでカラーを2回指定しているところ？カラーコード調べてみたけどこんなコードはなかったみたいだからそこかな。
さて、今回もProgateで学習を進めていきますよ～。今回は「mainのレイアウト」を学んでいきます。今回はメインの要素としてdivを3つ作って、文中の文字の一部だけ色を変えていくんですが、そのために新たにspan要素っていうのを学んでいくらしい。
ちなみに前回の記事はこちらね
ブロック要素とインライン要素の違いは改行の有無？
今回文中の一部の文字の色を変えるにあたって、spanタグっていうのを使っていくんですが、それはインライン要素なんですって。それは前後に改行が入らない要素で、文中の一部の文字色だけ変える時とかに役立つそうな。一方でこれまで使ってきたdivとかh1タグとかはブロック要素って言って、親になる要素の横幅一杯に広がる要素なんだって。「横幅いっぱいに広がる」っていうのが何を意味しているのかちょっと疑問ですが、そういうもんだと思って、いつもの習うより慣れろ作戦でいきます。
これまで勉強してきた中だとこんな感じに分けられるらしい。
| ブロック要素 ※親要素の横幅一杯に広がって改行が入る |
<div>、<h1>、<p>など |
| インライン要素 ※改行が入らず、囲むと要素内の一部だけいじれる？ |
<a>、<span>など |
なるほど～
Progateのレベル10へ
今回も演習に進むと、ちょっと苦戦しました。
copy-containerっておいcalss名でdivを作って、その中にh1とh2を作って、それぞれテキストを入れているんだけど、そのh1とh2の文字サイズを別々に指定しなければいけない状況です。CSSは以下まで行った。
.copy-container {
font-size: 140px;
}
あれ、h1だけ指定したいんだけどどうすんだっけ？ってなって、最初にやったのが以下
.copy-container {
.h1 {
font-size: 140px;
}
}
あれーh1だけ指定すんのどうやんだっけなと。さっきやったのに全然気づけなかった笑
正解は以下。
.copy-container h1{
font-size: 140px;
}
CSSでセレクタを指定する時に、.◯◯◯ってセレクタの後に、半角スペース空けて、入れ子になっている要素を指定すると、その要素にだけプロパティ指定して変更を反映出来るんです。今回は.copy-containerの中に入れ子になっているh1を書いてあげることで、今回の課題クリア。
まさに今回やったじゃ～んっていうのが出来ない。でもわかると楽しい。
レベル10！！！
最近はレベルが上がりにくくなってたので久しぶりのレベルアップ！
そういえばこのレベルっていくつまであるんだろうか。99かな。255かな。先はまだまだ長そうですが、着実に進んでいる。
副業での学びは、間が空いちゃっても自分を卑下しないこと
実は今回の記事、書くのに4日かかっています。スライドでのインプットも日をまたいで飛び飛びになってしまって、演習でももたついてしまった。以前は2日間やらないっていうことはあったけど、今回はその倍空いてしまった。
ちなみにその2日間、丸っとなんもやんなかった時に記憶の消失っぷりにビビッた時の記事がこちら
今回は間でほんの少しだけスライド見てたりしたから記憶自体は割とすっと戻ったけど、継続させてたものが途切れると途端にやる気が持ってかれちゃう人っていると思うんですよね。僕もどっちかっていうとそっち。
そうなると一気に離れてしまうこともあったんですが、副業で何かを学ぼうとするならば、その考えは捨てたほうが良さそうですね。「毎日必ず1時間勉強する！」って決めて必ず実行することも大事です。個人的にはそれが第一。ただそれが守れなかった時に、自分で自分のモチベーションを下げてしまって、結果的に離れてしまうような心の持ちようはよろしく無いです。ブログを始める人とかも多いんじゃないかな。最初は好調に書いてても、1回書かなくなるとそれから一気に離れていっちゃう、ていうケース。
それだと自分がたどり着きたいゴールに結局たどり着けなくなってしまうので、それよりかは、途中ちょっと寄り道して間が空いちゃっても、「オッケーオッケー！そういうとこあるよね自分！しょーがないなー！」くらいに軽く考えて、ちゃんと再スタートが切れるように、気持ちに折り合いを付けておくことも大事かなと思いました。
副業だと当然本業があるわけで、普通に生活してたって、計画も変わるわけで。過程に完璧を追い求めすぎずに、ちょっと時間かかっても、結果を得れた方が幸せだと思いました。
というわけで次はコンテンツの構造ですって。タイトルからは何するのかわからないね。ですが次も頑張っていきます～
