2021.08.08
テーマ： HTMLタグのお勉強(104)
カテゴリ： HTMLを知る
ここでちょっと
遊んでみたいと思います。
前回のhtmlに少し追加します。
<!DOCTYPE html>
ピンク色の部分を本文に追加してみました。
<h2></h2>
<h3></h3>
<p></p>
が追加されたのが分かりますでしょうか。
<h2><h3>は、見出しの部分です。
この、２と３は、見出しの文字の大きさになります。
<p>は段落です。
文章を作成して入れてみましょう。
これで、html形式で保存します。
cssは、前回作成したままのものを使うので、
<head>部分のリンクは変えません。
cssの内容は、<p>の段落の部分を青色にする。でした。
今作成したhtmlを開いてみましょう。
↓
↑
どうでしょうか。
ちゃんと、段落が青色になっています。
というような違いがわかりますか？
文字の大きさや、色を変えただけでもワクワクしてきますね！
ここでちょっと
遊んでみたいと思います。
前回のhtmlに少し追加します。
<!DOCTYPE html>
<html>
<head>
<title>タイトルを入れる</title>
<link href="stylesheet/test.css"rel="stylesheet">
</head>
<body>
<h1>第１章</h1>
<p>早速作ってみよう。</p>
<h2>その１</h2>
<p>パソコンの電源を入れてみよう。</p>
<h3>その２</h3>
<p>メモ機能を使って作ろう。</p>
</body>
</html>
ピンク色の部分を本文に追加してみました。
<h2></h2>
<h3></h3>
<p></p>
が追加されたのが分かりますでしょうか。
<h2><h3>は、見出しの部分です。
この、２と３は、見出しの文字の大きさになります。
<p>は段落です。
文章を作成して入れてみましょう。
これで、html形式で保存します。
cssは、前回作成したままのものを使うので、
<head>部分のリンクは変えません。
cssの内容は、<p>の段落の部分を青色にする。でした。
今作成したhtmlを開いてみましょう。
↓
↑
どうでしょうか。
ちゃんと、段落が青色になっています。
というような違いがわかりますか？
文字の大きさや、色を変えただけでもワクワクしてきますね！
お気に入りの記事を「いいね！」で応援しよう
[HTMLを知る] カテゴリの最新記事
-
cssに追加してみよう3 2021.08.15
-
cssに追加してみよう2 2021.08.12
-
cssに追加してみよう１ 2021.08.11
【毎日開催】
15記事にいいね！で1ポイント
© Rakuten Group, Inc.
