(1) 文章が改行されない
|
↓こう書いているのに
SRC=1-1.html
ブラウザで表示されると
こうじゃありませんか？
テキストエディタで改行をちゃんと入れているのに
思ったところで改行されていません。
それは何故でしょう？
それはhtml文書で改行を入れるには、
わざわざ改行命令の<br>タグを書かないといけないからです。
|
|
<br>：改行する。
|
それでは先ほどのソースに書き込んでみましょう！
改行したいところに<br>を書き込みます。
SRC=1-2.html
こんな感じにちゃんと改行されました。
ちなみに下のソースのものとも比べてみてください。
エディタでの改行位置がめちゃくちゃにしたものです。
SRC=1-3.html
こんな感じに同じですよね？
てなところで
html文書で改行する方法がわかって頂けたでしょうか？
つまり
|
| ポイント
|
テキストエディタの改行は無意味！
|
基本的に<br>タグを書かないと改行されません。
改行されてもブラウザの右端で折り返される形になります。
た・だ・し！
|
|
<pre>〜</pre>：エディタのイメージまま出力
|
このタグを使った場合は違います。
試しにやってみると
SRC=1-4.html
こんな感じにエディタで打ったイメージになります。
※僕はこのタグはあまり好きではありません。
|
|
(2) 文字を強調したい。
|
前項までで文章を打てる様になりました。
そうなるとやっぱ文字を強調してみたりしたくなりますよね？
では文字強調の次の３つのタグについて説明します。
|
<i>〜</i>：イタリック文字
<b>〜</b>：Bold(太字）
<u>〜</u>：アンダーライン
|
使い方は簡単です。
強調したい文字or単語をこのタグで囲えばＯＫです。
では 1-2.html に以下の強調を足してみましょう！
(1)「今日」→イタリック文字
(2)「天気が良い」→太字
(3)「元気にがんばるぞ！」→アンダーライン
(4)「気持ち」→イタリック文字、太字、アンダーライン
答えは
(1-ans) <i>今日</i>
(2-ans) <b>天気が良い</b>
(3-ans) <u>元気にがんばるぞ！</u>
(4-ans) <i><b><u>気持ち</u></b></i>
となります。
※(4)について <i>、<b>、<u> は特に順番規則はありません。
※好きなように並べてください。
ソースは↓こんな感じになります。
SRC=1-5.html
こんな感じに表示されましたでしょうか？
閉じタグ</XXX>を忘れると酷いことになります。
これでいろんな強調が出来るようになりました。
|
| ポイント
|
|
文を書いてから強調タグを足していきましょう！
|
文を書いちゃってから、強調したいところに
タグを書き加えていくと
閉じタグを忘れることが少ないです。
|
|
(3) 文字の大きさや色を変えたい。
|
文字の大きさや色を変えるには次のタグを使います。
|
<font>〜</font>：フォントの設定を行う。
size=(size)：大きさを指定する。
color=(color)：色を指定する。
|
(size)は１〜７または相対サイズ(±値)を指定します。
数値を指定した場合
<font size=7>7</font>---7
<font size=6>6</font>---6
<font size=5>5</font>---5
<font size=4>4</font>---4
<font size=3>3</font>---3
<font size=2>2</font>---2
<font size=1>1</font>---1
相対サイズの場合
<font size=+4>7</font>---7
<font size=+3>6</font>---6
<font size=+2>5</font>---5
<font size=+1>4</font>---4
<font size=+0>3</font>---3
<font size=-1>2</font>---2
<font size=-2>1</font>---1
※相対の場合は<basefont>で指定したサイズが基準になります。
※<basefont> タグに関しては後の章で書く予定です。
※デフォルトでは size=3 が基準になります。
※相対サイズと言えども size=7 より大きいサイズにはなりません。
(color)は全章で学んだ<body>タグの
bgcolorとかtextと同じで
カラーネームまたはRGB値を指定します。
ちなみに僕が使うのはこんな感じ。
例えば
<font color=red>red</font>---red
<font color=blue>blue</font>---blue
<font color=yellow>yellow</font>---yellow
↑こんな感じです。
では、
の所々のフォントのサイズと色を変えてみましょう！
(1)「今日」→サイズ６
(2)「天気が良い」→赤色
(3)「元気にがんばるぞ！」→サイズ２
(4)「気持ち」→サイズ５＋青色
答えは
(1-ans) <font size=6>今日</font>
(2-ans) <font color=red>天気が良い</font>
(3-ans) <font size=2>元気にがんばるぞ！</font>
(4-ans) <font size=5 color=blue>気持ち</font>
こんな感じです。
ソースは↓こうなります。
SRC=1-6.html
こんな感じで表示されます。
こんなところで<font>タグの使い方をわかって頂けたでしょうか？
|
| ポイント
|
サイズと色を変えるところだけを
<font>〜</font>で囲うようにしましょう！
|
必要以上に<font>〜</font>を使用すると
どこまでがどのサイズか？どの色か？
わからなくなってしまうので
必要最小限にしましょう！
特に文字の基本の色は前の章で学んだ
<body text=XXX> で指定しておきましょう！
|
| ポイント
|
|
文字強調との組み合わせもＯＫ！
|
例えば
<font size=7 color=red><u><i>こんな感じ</i></u></font>
こんな感じ
となります。
|
