1．改行する
<br>
<br>タグを使うことでHTML文書では、改行することができます。
逆に、このタグを使わないとソースで、改行してもプラウザ上では改行されないので注意してください。
<html>
<head>
</head>
<body>
このタグは、<br>
数あるタグの中でも超重要です。<br>
<br><br><br><br>
必ず、覚えておきましょう。
</body>
</html>
|
⇒サンプル |
|
2．改行しないで表示する
<nobr>〜</nobr>
<nobr>タグで文字列を挟むと文字列を改行しないで表示することができます。
普通、文章は画面の右端までいくと、自動的に改行されるようになっていますが、
このタグを使うといつまでたっても改行されずに表示することができます。
ただし、<br>タグや<wbr>タグ（ウインド幅に入らない時のみ改行）を使えば改行することもできます。
<html>
<head>
</head>
<body>
<nobr>
このタグは、果たしてどのように使えば良いのだろうか
実をいうと、あまり使ったことがないのです。
このタグは…（すいません!!）<wbr>
だって、使うとこないでしょ。<br>
改行しないタグなんて!!<wbr>
ウインドウの大きさをいろいろ変えてみてくださいね。
<nobr>
</body>
</html>
|
⇒サンプル |
|
3．段落を作る
<p>
<p>タグを使うことによって、改行し、一行のスペースをいれることができます。
<html>
<head>
</head>
<body>
改行されると文章は、一段と見やすくなるのです。<p>
読みやすい文章はアクセスアップの秘訣です。<p>
がんばりましょう。
</body>
</html>
|
⇒サンプル |
|
4．文章の位置を指定する
<div align="*">〜</div>：標準の位置指定
<p align="*"l>〜</p>：段落を作り位置指定
<h◇ align="*">〜</h◇>：大きさを変えて位置指定
上記のタグを使うことによって、文章の位置を指定することができます。
ただし、指定できる位置は右揃え、中央揃え、左揃えの３つです。
*には left、center、 right のいづれかを指定。
<html>
<head>
</head>
<body>
<div align="left">標準右揃え</div>
<div align="center">標準中央揃え</div>
<div align="right">標準左揃え</div>
<p align="left">段落右揃え</p>
<p align="center">段落中央揃え</p>
<p align="right">段落左揃え</p>
<h1 align="left">でっかい右揃え</h1>
<h3 align="center">普通の大きさ中央揃え</h3>
<h6 align="right">小さいよ左揃え</h6>
</body>
</html>
|
⇒サンプル |
※<p>タグは、改行をし、スペースをいれるというタグです。Lesson５を参照。 |
5．センタリング
<center>〜</center>
<center>タグで文字列を挟むとその文字列は画面の中央に表示されます。
このタグも、とても使う頻度が高いので覚えておくといいと思います。
<html>
<head>
</head>
<body>
<center>
このタグを使うと、とてもきれいに文字が表示されます。<br>
いろいろ、試してみてくださいね。<br>
がんばれぇ〜
</center>
</body>
</html>
|
⇒サンプル |
|
6．HTMLをそのまま表示
<pre>〜</pre>
<pre>タグで文字列を挟むとその文字列は、ソースそのままに表示されます。
つまり、このタグを使うと改行などもいちいちタグを使って指定しなくても良くなります。
ただし、このタグないでは、文字の色や大きさなどを指定できないので単調な文字になります。
それでも、とても使い勝手がいいタグなので使ってみてください。
<html>
<head>
</head>
<body>
<pre>
いろいろできるのでやってみてください。
例）
よ
ろ
し
くっ
zeitです。ツァイトと読みます。
るっ
ば
ん
が
</pre>
</body>
</html>
|
⇒サンプル |
|
7．動きのある文字
<marquee * >〜</marquee>
<marquee>タグをつかうと動きのある文字を表示することができます。
ただし、ネットスケープでは表示されません。
それでは、マーキータグの指定方法を説明していきます。（ちょこっと、複雑です。）
マーキータグは<marquee * >の * の部分に大きさ・背景色・位置・動き方などを指定する必要があります。
(@)大きさと位置･背景色
・height=□（□にピクセル、または％指定）：高さ、縦幅
・width=□（□にピクセル、または％指定）：幅、横幅
・hspace=□（□にピクセル指定）：左右の空間
・vspace=□（□にピクセル指定）：上下の空間
・bgcolor=□（□に#RRGGBB、直接色指定）：背景色
(A)動き方
・behavior=□（□に scroll , slide , alternate を指定）：動き方
・direction=□（□に left , right , up , down を指定）：動く方向
・loop=□（□に 回数(無限ループは”-1”) を指定）：回数
・scrolldelay=□（□に秒数を指定）：動く速さ
<html>
<head>
</head>
<body>
<marquee height=20% width=70% hspace=20
bgcolor=#ff0000 behavior=scroll
direction=left loop=-1 scrolldelay=10>
マーキーを使うことで、動きのあるページへ!!!
</marquee>
<marquee height=10% width=80% hspace=50
bgcolor=#696969 behavior=slide
direction=right scrolldelay=100>
ε=ε=┏( ･＿･)┛
</marquee>
<marquee height=35% width=50% vspace=30
bgcolor=#00ffff behavior=alternate
loop=-1 direction=up scrolldelay=50>
どんどん、使ってみましょう〜〜〜
</marquee>
</body>
</html>
|
⇒サンプル |
|