ひながたのHTML文書の例
メモ帳で、ご自分のひながたのHTML文書ができましたら、文書を「html」か「htm」の拡張子
で保存してください。
たとえば「test.htm」といったファイルを作ってください。
<HTML>
<HEAD>
<TITLE>私の雛型</TITLE>
</HEAD>
<BODY BGCOLOR="#cce8bb">
<TABLE width=300 border="0" cellpadding="3">
<TR>
<TD align="center" valign="middle" bgcolor="#ffbbbb">
<B><FONT size=5>メインタイトル</FONT></B></TD>
</TR>
</TABLE>
<!-- サブタイトル -->
<TABLE width=550 border="0" cellpadding="3">
<TR>
<TD nowrap align="center" valign="middle" bgcolor="#ccccff">
<B><FONT size="4">サブタイトル</FONT></B><BR>
<P>
日付とかコメント<BR>
</TD>
</TR>
</TABLE>
<!-- 写真を1枚真中に配置 -->
<TABLE width=550 border="0" cellpadding="3">
<TR>
<TD align="center"><IMG SRC="p1.jpg" ALT="画像の説明" width=273 height=200></TD>
</TR>
<TR>
<TD align="center">
<B>写真の下にコメント</B>
</TD>
</TR>
</TABLE>
<!-- 写真を2枚並べる -->
<TABLE width=580 border="0" cellpadding="3">
<TR>
<TD align="center"><IMG SRC="p1.jpg" ALT="画像の説明"></TD>
<TD align="center"><IMG SRC="p1.jpg" ALT="画像の説明"></TD>
</TR>
<TR>
<TD nowrap colspan="2" align="center" valign="middle" bgcolor="#ffffbb">
<B>写真2枚の下、真中にコメント</B>
</TD>
</TR>
</TABLE>
<!-- 写真の横にコメント -->
<TABLE width=580 border="0" cellpadding="3">
<TR>
<TD align="center"><IMG SRC="p1.jpg" ALT="画像の説明"></TD>
<TD valign="middle">
<B>写真の右側にコメント。<BR>
左右を入れ替える場合は<BR>
<TD>から</TD>までを入れ替える。</B><BR>
</TD>
</TR>
</TABLE>
<!-- 枠付きのアルバムの例 -->
<TABLE width=580 border="2" cellpadding="3">
<TR>
<TD align="center"><IMG SRC="p1.jpg" ALT="画像の説明"></TD>
<TD align="center"><IMG SRC="p1.jpg" ALT="画像の説明"></TD>
</TR>
<TR>
<TD align="center" valign="middle" bgcolor="#ffffbb">
左の写真のコメント
</TD>
<TD align="center" valign="middle" bgcolor="#ffffbb">
右の写真のコメント
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
|
HTML文書での<>の中の意味などは、
HTML文書で使われるのタグの基本リストを参考にしてください。
また、私のホームページの作り方をよろしかったら
参考にしてください。 きっと、貴方も簡単にホームページが作れるようになります。
|