インフラエンジニアがProgateのHTML & CSS 初級編を受講してみた。#1

ちょっとした興味でProgateのHTML & CSSの初級編を試しにやってみました。
HTML & CSSの初級編は無料アカウント枠内で受講可能なので手軽に始められます。
ちなみに初級編受講時の私のWeb関係の知識としては、HTMLとCSSでWebサイトが構成されている程度でした。

HTML & CSS 初級編のレッスン内容

レッスン1 HTMLに触れてみよう!

レッスン1はブラウザ上にHTMLで記述した”Hello, World”を出力させると言う内容。

<h1>Hello World</h1>

レッスン1ブラウザ表示例

レッスン2 見出しと段落

レッスン2はh1,h2タグを使って見出しと段落を出力させる内容。

<h1>プログラミングの世界へようこそ</h1>
<h2>Progate とは</h2>
<p>オンラインのプログラミング学習サービスです</p>

レッスン2ブラウザ表示例

レッスン3 リンク

レッスン3はhrefを使ってリンクを作成する内容。

<a href="https://prog-8.com">Progate</a>
<a href="https://google.com">Google</a>

レッスン3ブラウザ表示例

レッスン4 画像

レッスン4はimgを使ってブラウザ上に画像を表示させる内容。

<img src"https://prog-8.com/images/html/beginner/wanko.jpg">
<img src"https://prog-8.com/images/html/beginner/school.jpg">

レッスン4ブラウザ表示例

レッスン5 リスト

レッスン5はliを使ってのリスト表記を出力させる内容。

<ul>
   <li>HTML</li>
   <li>PHP</li>
   <li>Ruby</li>
</ul>

レッスン5ブラウザ表示例