HP-目次-
HOME
1day講座
1日で習得！HTML言語
1 2 3 4
1日で習得！スタイルシート
1 2 3
実用的なHTML言語
空白文字
altとtitle属性
meta属性
tableを作ろう
optionを使う
address属性
コメント
hrの横線を
背景の増殖リファレンス
HTML言語
スタイルシートホームページ作成
素材に関して
アクセスカウンター
ソフトに関してふぁるるのホームページ奮闘記
diary、ホームページ奮闘記録
ネットとマナー、ネチケット
私の恥ずかしくて、人に見せられない、ド下手ページの数々orz
ホームページ作成講座。1day講座
1日で習得！HTML言語の講座
ここはホームページを作った事がない方。HTML言語、スタイルシートという言葉を始めて聞いたあなたでも、
1日でHTML言語とスタイルシートを使って、
ホームページが作れるようになります♪
HTML言語で画像の表示
public_htmlフォルダ内にa.html、b.htmlのHTMLファイルを作って下さい。
（ホームページの間の移動、
リンクで既にある方はそのファイルを流用してください。）
加えて、以下の画像を使用します。
画像１
画像２
画像３
画像４
画像５
この５つの画像をjpg形式で1.jpg〜5.jpgで
public.html内に保存してください。
a.htmlの内容
<!DOCTYPE html PUBLIC"-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>HTML言語でページ間移動を可能に</title>
</head>
<body>
<img src="1.jpg">
<br>
<img src="2.jpg">
<a href="b.html" target="_top">
<img src="3.jpg">
</a>
</body>
</html>
b.htmlの内容
<!DOCTYPE html PUBLIC"-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>HTML言語でページ間移動を可能に</title>
</head>
<body>
<img src="1.jpg">
<br>
<img src="2.jpg">
<a href="a.html" target="_top">
<img border="0" src="4.jpg" width="88" height="31">
戻るをクリックすると戻れます。
</a>
</body>
</html>
<img src="画像のファイル名.拡張子">で、
ホームページ上に画像を表示できます。
brと同様に終了タグはありません。
また画像は文字と同様に<a></a>で囲むことにより
サイト間の移動に使えます。
<img border="" src="" alt="" width="" height="" title="">
<img>は上記のように
border、alt、width、height、titleといった属性を付加できます。
borderは画像をaで囲った時に出る枠の太さです。
width（幅）、height（高さ）は表示されている画像の大きさです。
altとtitleは画像やサイトの説明（キーワード）です。
HTML言語、違うフォルダからの画像呼び出し
今回のHTML言語の画像の表示は同じフォルダ内に、画像ファイルがないと表示できません。
public_htmlの中にidouというフォルダを作ってみてください。
idouフォルダの中に1.jpgだけを入れます。
a.htmlとb.html双方とも、画像が表示されなくなります。
"1.jpg"を"idou/1.jpg"に変更してください。
これでa.htmlからb.htmlの双方とも画像が表示されるようになります。
idou/はidouフォルダの中と言う意味です。
idouフォルダ内に1.jpgがあるため表示されます。
異なるフォルダ（場所）からの呼び出しは<a>も<img>も同じです。
次で、いよいよ最後です。
スタイルシートを使って、
文章の表示場所や画像の表示場所を好きな位置に動かします♪
当サイトは全て、
手打ちのHTML言語、及びスタイルシートで作成されています。
リンク
リンクについて
リンクフリーなのです。banner画像
LINKページ
文字化け解消
管理人
profile
著作権
Copyright(C)2007-2008 ふぁるるAll rights reserved
転載禁止。
サイトの更新履歴
お世話になっている検索エンジンサイト様sponsor by 検索エンジン and ダイエット
作者情報;ふぁるる http://www.faruru.info/
