『マウスオン』各種です・Ｐａｒｔ ３-Ｂ

★ここにアルバムタイトル★※ここに説明文など <> <> <> <> <> <> <> <> <> <>

　少し間が空いてしまいました。今回の『ＮＦＷのブログ教室』は前回に引き続き『マウスオン』各種ですのＰａｒｔ ３のＢとなります。前回の教室ではサムネイル画像は５枚でしたが、これを１０枚以上に増やす方法です。とりあえず１０枚に増やしたＨＴＭＬを紹介します。

<table width="500" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td><table width="500" border="1" cellpadding="2" cellspacing="0" bordercolorlight="#FF9900" bordercolordark="#FFFFFF" bgcolor="#FFD699"><tr><td align="center"><strong><font color="#006600" size="+2">★ここにアルバムタイトル★</font></strong><br>※ここに説明文など</td></tr><tr><td align="center"><table width="500" border="0" align="center" cellpadding="0" cellspacing="0" bordercolorlight="#FF9900" bordercolordark="#FFFFFF" bgcolor="#FFD699"><tr><td bgcolor="#ffffff" align="center"><img src="●一枚目画像のＵＲＬ" alt="「タイトル1」" name="psr3"width="500" height="375"></td></tr><tr><td align="center"><TABLE width="100%" BORDER="0" align="center" CELLPADDING="4" CELLSPACING="0" bordercolor="#FF9900" bgcolor="#F7F0B5"><TR><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="●一枚目画像のＵＲＬ" alt="「タイトル1」" width="90" height="70"onMouseOver="psr3.src='●一枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="◆二枚目画像のＵＲＬ" alt="「タイトル2」" width="90" height="70"onmouseover="psr3.src='◆二枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="▲三枚目画像のＵＲＬ" alt="「タイトル3」" width="90" height="70"onmouseover="psr3.src='▲三枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="★四枚目画像のＵＲＬ" alt="「タイトル4」" width="90" height="70"onmouseover="psr3.src='★四枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="■五枚目画像のＵＲＬ" alt="「タイトル5」" width="90" height="70"onmouseover="psr3.src='■五枚目画像のＵＲＬ'">></TD></TR><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="●二段目一枚目画像のＵＲＬ" alt="「タイトル1」" width="90" height="70"onMouseOver="psr3.src='●二段目一枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="◆二段目二枚目画像のＵＲＬ" alt="「タイトル2」" width="90" height="70"onmouseover="psr3.src='◆二段目二枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF">i<<img src="▲二段目三枚目画像のＵＲＬ" alt="「タイトル3」" width="90" height="70"onmouseover="psr3.src='▲二段目三枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="★二段目四枚目画像のＵＲＬ" alt="「タイトル4」" width="90" height="70"onmouseover="psr3.src='★二段目四枚目画像のＵＲＬ'"></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="■二段目五枚目画像のＵＲＬ" alt="「タイトル5」" width="90" height="70"onmouseover="psr3.src='■二段目五枚目画像のＵＲＬ'">></TD></TR></TABLE></td></tr></table></td></tr></table></td></tr></table>

お気付きかと思いますが単にサムネイル画像の１～５の部分を追加しただけです。追加するのは下記の部分です。

<TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="●二段目一枚目画像のＵＲＬ" alt="「タイトル1」" width="90" height="70"onMouseOver="psr3.src='●二段目一枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="◆二段目二枚目画像のＵＲＬ" alt="「タイトル2」" width="90" height="70"onmouseover="psr3.src='◆二段目二枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF">i<<img src="▲二段目三枚目画像のＵＲＬ" alt="「タイトル3」" width="90" height="70"onmouseover="psr3.src='▲二段目三枚目画像のＵＲＬ'">></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="★二段目四枚目画像のＵＲＬ" alt="「タイトル4」" width="90" height="70"onmouseover="psr3.src='★二段目四枚目画像のＵＲＬ'"></TD><TD align="center"><font style="font-size:0px;color:#FFFFFF"><<img src="■二段目五枚目画像のＵＲＬ" alt="「タイトル5」" width="90" height="70"onmouseover="psr3.src='■二段目五枚目画像のＵＲＬ'">></TD></TR>

これを前回の教室のＨＴＭＬのどの部分に追加するかというと

これを繰り返せば５の倍数の数のサムネイル画像を載せる事ができます。もちろん前回までの教室でお伝えした方法を使えば４でも６でもその倍数のサムネイル画像が載せられます。

『長いテキストを簡単にコピペするには・・・』としてトリプルクリック他を書こうと思ったのですが、文字数制限があるためこれ以上は文字をＵＰ出来くなりました。ごめんなさい次回です。