【HTML/CSS/Gitコマンド】個人的に忘れがちなところまとめ

はじめに

DMMWEBCAMPの専門技術コースを卒業し、転職しましたが、
現在働きながら、PHPのコースを受講しております。
（業務ではRubyやPHPには全く触れていません）

使わないと忘れる

まずは GitコマンドやHTML/CSSの学習からしていますが、専門技術コース受講時に学んでいたにも関わらず、「そういえばそうだった・・・」等、忘れていた箇所をまとめていきます。

Gitコマンド系

ターミナル：「↑」

ターミナルやGitBashで利用。
↑を押すと前回実行したコマンドが表示される。
そういえばそうだった・・・。

git init の意味

git addは覚えてたけどgit initって何だったっけ？？
git initは、リポジトリを新規作成するコマンドで、
git initすることで、ローカルリポジトリとして登録される。
.gitというリポジトリに必要な内容が入っているディレクトリが作成される。
これに関しては、どういう目的でやっているのかを忘れておりました。

コマンド：ファイルへの追記 "echo"

以下のコマンドでREADME.mdにhogeeeeee追記できる
echo "hogeeeeee" >> README.md

HTML/CSS系

インライン要素の中央揃えは　"text-align:center;"

ブロック要素とインライン要素で、中央揃えの仕方は違う。

画像"img"もインライン要素

画像のimgタグはインライン要素なので、テキストと同じ扱い。
親要素に、text-align: center; を設定します。
"""親要素"""指定

HTML内部のmain要素

あまり使用できてなかったような気がします。
bodyの中はdivだらけでmainのように、ここがmainのコンテンツですよーと
明示的には記述できてなかった気がします。

HTML

<main>
 ”ページ内の中心的なコンテンツ”
　　この中には、Webページのmainにしたい要素を収める
　　この中に　header footerがあるのはおかしい
</main>

HTML内部のsection要素

HTML

<section>
 ”ページや記事の一部分を表す”
　 section要素には、必ず見出し要素（<h1>系）必要！
 divとは適切に使い分けること！！
</section>

CSS:ある要素の中のdiv

testクラス内のdivにCSSを適用させたい場合、

CSS

testクラス直下にあるdiv要素を指定
.test > div {
  width: 33%;
  height: 300px;
}

CSS:ある要素の中の最初の要素

ヘッダーの中の最初の要素
header>:first-child{
  margin-right: auto;
}

flex-basis　

flex-basis
フレックスアイテムの横幅を指定
flex-basis:120px;みたいな感じ

flex-grow

横幅の伸びる比率

終わり

HTML/CSSの箇所については、”誰にでも分かる＆見やすい”コードを書く上では必要な知識だったのに、
何だか忘れてたり、何となく覚えてはいるけど使えていなかったりしましたので、
今回しっかりと復習できてよかったです！！

使わなくても目的は達成できるけど、ちゃんと使って覚える。