ハードコーディングを（html/css）やってみよう！
この記事は超初心者向けに執筆しているので、経験者は回れ右です。
前記事： http://milk-design.net/?p=136
前記事の動画： https://youtu.be/0SWMIbbxCu8
目次
この記事に向いている方
・パソコンが使える小学生
・コーディングに興味があるwebデザイナー
ではcssとの連携をしてみましょう。
その前にhtmlとcssの違いとは
超簡単に言うと、
HTML：情報
css：装飾
となります。css（装飾）に文章を書くことはできません。
htmlだけだと、一応「どんな情報」かは分かります。
cssと連携させるとレイアウトや色などを決めることが可能になります。
フォルダとindex.cssを作成
画像の通りに「css」フォルダを作ります。
テキストエディタの内容はカラで良いので、「index.css」というファイルを作って保存しましょう。
htmlには「タグ」が必要
htmlには「タグ」というコードを書くことで要素を指定する事ができます。
タグは必ず両端に付けるルールとなります。
<タグ>文字文字文字</タグ>タグの意味は50種類以上あります・・・。まず暗記などはしなくて良いです。
その都度経験して1つずつ脳に刻みましょう。
代表的なコードは以下です。（調味料と言えば砂糖と塩！並の超超超基本タグです。）
<div>要素をとりあえずグルーピングしたい時はdivタグで囲みます</div>
<p>文章を書きたい時はpタグで囲みます</p>
<a href="URLURLURL">リンクをつけたい時はaタグで囲みます</a>cssとの連携タグ
cssとの連携タグは以下となります。
これをhtmlの1行目に記載してください。
<link href="css/index.css" rel="stylesheet">
試しにcssになにか書いてみる
cssの記述ルールとしては以下です。
htmlの要素名（クラス名） {
css要素名: 指示内容;
}ためしにpタグの色を #D06224 にしてみましょう。
下記を「index.css」にコピペして更新してみてください。
p {
color: #D06224;
}色コードはadobeのデザインソフトのカラーパレットや、
https://colorhunt.co/
https://paletton.com/#uid=1000u0kllllaFw0g0qFqFg0w0aF
からも拾えますよ。
pタグの色を変更できました！
なんとなくですが、「cssは装飾に使う」という事が理解できたのではないでしょうか。
次回はhtmlの上部にタイトルタグやクラスをつけてみましょう。ではまた！
