サイトマップ(すべてのページ)










ver4 FC2ブログで複数の画像やバナーを横に並べる方法(かなり豊富)(色あり)最新バージョン

当ページは最終バージョンです。最終バージョンは次に示す通り2種類あります。
 ┣ 最終バージョン(fc2ブログでないブログや通常サイトでも使える)・・・今見ているページです。
 ┗ 最終バージョン(fc2ブログで使える。ものすごく便利)



この方法の特色・・・「自動改行」のモードのままで、簡単に画像やバナーを横に並べることができる。


では、さっそくやってみよう。

●このページの使い方: fc2ブログの管理画面 → 新しく記事を書く(というリンク) → 簡易モードをOFF → ずーっと下にスクロールして、自動改行になっていることを確認(慣れていれば確認するまでもないが) → あなたのブログ記事をいつものように書く。すると、画像やバナーを横に並べて載せたくなったとしよう → B の欄のソースを、画像やバナーなどを載せたい部分に貼り付ける → 「①」とか「②」とかの部分を、掲載したい文字や画像ソースやバナー広告ソースに取り替える → 必要に応じて部分的に A のソースに取り替える。

A
必要に応じて取り替え可能:

●取り替え前・・・   align="left"      ・・・左寄せ
○取り替え後・・・   align="center"    ・・・中央寄せ
○取り替え後・・・   align="right"     ・・・右寄せ

●取り替え前・・・   valign="top"     ・・・上揃え
○取り替え後・・・   valign="middle"   ・・・中央揃え
○取り替え後・・・   valign="bottom"   ・・・下揃え

●取り替え前・・・   border="1"      ・・・境界線あり
○取り替え後・・・   border="0"      ・・・境界線なし


B



<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td></tr></tbody></table>




<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td></tr><tr><td align="left" valign="top">③</td><td align="left" valign="top">④</td></tr></tbody></table>




研究
質問: すぐ上の「あ」と「い」のソースの違いを教えて。
解答: 下記の【【【【【【 と 】】】】】】】の間のものが有るか無いかの違いだけです。

<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left"valign="top">②</td></tr>【【【【【【<tr><td align="left" valign="top">③</td><td align="left"valign="top">④</td></tr>】】】】】】</tbody></table>








<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td><td align="left" valign="top">③</td></tr><tr><td align="left" valign="top">④</td><td align="left" valign="top">⑤</td><td align="left" valign="top">⑥</td></tr></tbody></table>




<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td><td align="left" valign="top">③</td><td align="left" valign="top">④</td></tr></tbody></table>





<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td><td align="left" valign="top">③</td><td align="left" valign="top">④</td></tr><tr><td align="left" valign="top">⑤</td><td align="left" valign="top">⑥</td><td align="left" valign="top">⑦</td><td align="left" valign="top">⑧</td></tr></tbody></table>






<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td><td align="left" valign="top">③</td><td align="left" valign="top">④</td><td align="left" valign="top">⑤</td></tr></tbody></table>





<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td><td align="left" valign="top">③</td><td align="left" valign="top">④</td><td align="left" valign="top">⑤</td></tr><tr><td align="left" valign="top">⑥</td><td align="left" valign="top">⑦</td><td align="left" valign="top">⑧</td><td align="left" valign="top">⑨</td><td align="left" valign="top">⑩</td></tr></tbody></table>





<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td></tr><tr><td align="left" valign="top">②</td></tr><tr><td align="left" valign="top">③</td></tr></tbody></table>




<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td></tr><tr><td align="left" valign="top">③</td><td align="left" valign="top">④</td></tr><tr><td align="left" valign="top">⑤</td><td align="left" valign="top">⑥</td></tr></tbody></table>




<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td></tr><tr><td align="left" valign="top">②</td></tr><tr><td align="left" valign="top">③</td></tr><tr><td align="left" valign="top">④</td></tr></tbody></table>




<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td></tr><tr><td align="left" valign="top">③</td><td align="left" valign="top">④</td></tr><tr><td align="left" valign="top">⑤</td><td align="left" valign="top">⑥</td></tr><tr><td align="left" valign="top">⑦</td><td align="left" valign="top">⑧</td></tr></tbody></table>





<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td></tr><tr><td align="left" valign="top">②</td></tr><tr><td align="left" valign="top">③</td></tr><tr><td align="left" valign="top">④</td></tr><tr><td align="left" valign="top">⑤</td></tr></tbody></table>





<table border="1" width="100%"><tbody><tr><td align="left" valign="top">①</td><td align="left" valign="top">②</td></tr><tr><td align="left" valign="top">③</td><td align="left" valign="top">④</td></tr><tr><td align="left" valign="top">⑤</td><td align="left" valign="top">⑥</td></tr><tr><td align="left" valign="top">⑦</td><td align="left" valign="top">⑧</td></tr><tr><td align="left" valign="top">⑨</td><td align="left" valign="top">⑩</td></tr></tbody></table>







スポンサーサイト
[ 2011/04/22 18:15 ] 未分類 | TB(0) | CM(0)

コメントの投稿













管理者にだけ表示を許可する

トラックバック:

この記事のトラックバック URL
http://dejitaruanarogu.blog.fc2.com/tb.php/14-714266bb




 スポンサード リンク


















ページを開くだけで使える:
カウントダウンタイマー
(例:7分後にアラーム) (直リンク) 「リリリリ-ン」が5秒間
カウントダウンタイマー
(例:PM2:58にアラーム) (直リンク) 自由指定の動画と音声で知らせる
時間計算機 (直リンク
電卓 (直リンク
●ストップウォッチ(直リンク












光ファイバーの広告
寝ている猫を小鳥が突っついて起こす動画。





っっt