BeanKidzのブログ -3ページ目

前ページ
次ページ

～色の変更～

今回は文字の色を変更したいと思います。

文字の色を変更するにはタグを使用します。
例としては、

<body>
こんにちは。 
BeanKidzのブログへようこそ。
</body>

これで、「こんにちは。」にタグが適用されることになります。

さて、color="#ff0000"とはなんでしょうか？
「 color　」は色を設定する呪文のようなものです。その後の「　ff0000　」に注目してください。
この数値は「光の三原色」を「16進数」で表したものです。
「光の三原色」とは、「赤緑青」のことです。透明以外の色はこの三色によって成り立っています。

では、「１６進数」とはなんでしょう？
皆さんが通常数を数える時には、０、１、２…、９と数えて次は「１０」となり、２桁となりますよね？
そしてまた１１、１２、…となり、「９９」の次は「１００」と３桁になります。
これは、「１０進数」といって一つの桁で「０～９」の10ヶの数を表現する方法です。

それに対して、「１６進数」は0～9の10ヶの数に加えて、A～Fの6ヶのアルファベットを用いて、一つの桁で、１６ヶの数を表現する方法です。

0～9までは数え方に変わりありませんが、9の次は「10」とはならずに、「A」と表現します。
数え方はこうです

0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F…10,11,12,13…19,1A,1B,1C,1D,1E,1F,20,21…

なんとなく感じはつかめたでしょうか？
「9の次はA～Fが入るんだ」程度で構わないと思います。

説明が長くなりましたが、color="#ff0000"の＃の後の6桁は赤緑青の順番に16進数で２桁ずつ表しています。
16進数の2桁ですので、最大数値は「FF」となります。

00に近づくほど、その色の度合いは弱くなり、FFに近づくほど度合いは強くなります。
ちなみに、三色全て00だと黒色、全てFFだと白色になります。

試しに「こんにちは。」に を適用してみてください。も忘れずに。

#は色の設定の際に必要ですので必ず6桁の前に記入してください。

赤色で表現されているでしょうか？
数値を色々と変えて遊んでみてください。

では(-^□^-)

～改行～

今回は改行についてお話をしたいと思います。
前回の続きから<body>タグの中の「こんにちは。」の後に文章を追加してみてください。

<body>
こんにちは。BeanKidzのブログへようこそ。
</body>

これを保存してInternetExplorerで表示してみましょう。

追加した文章も表示されていると思います。
しかし、「こんにちは。」の後ろで改行を入れたい場合はどうすればいいでしょう？
メモ帳やWordではエンターキーで改行ができました。

試しに一度「こんにちは。」の後ろでエンターキーを打ってみてください。

<body>
こんにちは。
BeanKidzのブログへようこそ。
</body>

これをInternetExplorerで開いてみると…

確かにエンターキーを入れたはずなのに全く改行がなされていませんね。
htmlの場合はWordなどの場合と異なり、改行もタグで示してあげなければいけません。

今度は「こんにちは。」の後ろに「　 　」と打ってみましょう。こんな具合です。

<body>
こんにちは。 BeanKidzのブログへようこそ。
</body>

これを保存し、表示してみると…

どうでしょうか？
 を入れた位置で下の行へ移っていると思います。
 タグを入れることにより、その場所で改行するんだと認識させることができます。

 は入れた数だけ改行がなされます。ですので、

<body>
こんにちは。 BeanKidzの ブログへ ようこそ。
</body>
このように打つと…

このように表示されます。わかりやすくすると…

赤文字は本来は見えません。

なんとなく、感じはつかめたでしょうか？
自分でタグの位置を変えたりして理解を深めていってください(^-^)

メモ帳で打つ時は、

<body>
こんにちは。 
BeanKidzの 
ブログへ 
ようこそ。
</body>

このようにしていただいてもかまいません。
いずれもっと長くなってくると思うので、
構成を見やすくすることはタグを打つ上では大事なことかと思います。

では（‐＾▽＾‐）

HelloWorld

はじめまして、はじめました、アメブロ。

これから超初心者が　html　やJavaScript　についてできるだけわかりやすく書いていこうと思います。

使用するのは基本的には「メモ帳」だけです。画像の加工などは「PaintGraphic」「DrawGraphic」で行いたいとおもいます。至らないところもありますがよろしくお願いします。

それではさっそく以下の文章をメモ帳で作成してみましょう。

<html>は中身がhtmlという言語であることを表すタグです。

<html >の中にある「lang="ja"」というのは、「日本語でページを作るよ」という意味でいいと思います。

<head>は後日説明いたしますので今は気にする必要はないかと思います。

<title>は上の青いバーに表示される文字を設定します。

<body>がWEBページの本編です。

タグは通常、<○○○>から始まり、</○○○>で終わります。

なので今回の<body>タグの場合、

<body>

こんにちは。

</body>

となっているため、「こんにちは。」の部分がhtmlの本編ということになります。

では一度名前を付けて保存してみましょう。

名前の入力についてですが、そのままでは最後が「*.txt」というただのテキストファイルになってしまい、

InternetExplorerでは開けなくなってしまいます。

なので一度、「*.txt」を消してしまい、「hello.html」という名前で保存しましょう。

これで今回メモ帳で作成した文章はhtmlファイルとなり、InternetExplorerで開けるようになります。

試しに開いてみましょう。

どうでしたか？同じように表示されたでしょうか？

終わりのタグを入れるのを忘れるとえらい目にあいますので忘れないようにしましょう。

タグの効率のいい入力方法は今後自分で打って見つけていきましょう。

遅くてもいいので確実にミスのないよう。

初回はこれで終了したいと思います。

前ページ
次ページ