サムネイルの順番

質問

イラストレーターのポートフォリオサイトを作っています。
構成は画像のサムネイルを、5×5のタイル状に並べ
それぞれをクリックすると別のウィンドウで詳細が見られるという
シンプルなものです。

画像は頻繁に追加します 。
その際、最新のサムネイルは5×5の左上に追加され、
5×5に収まりきれなくなったサムネイルは
次のページ（5×5のレイアウトは変わらず）に移動させるつもりです。

現状考えているのは、画像を追加するごとに、
手動でひとつひとつサムネイルとリンク情報をコピペしてずらしていく方法なのですが、
もし可能であれば、新しく追加する画像を指定すれば
自動的に5×5の左上に追加され、既存のサムネイルの順番もずれるようにしたいです 。

なにか方法はありますでしょうか？
HTML/CSSは本を見ながらなら理解できるレベルです。

回答No.2

神崎 渉瑠（@taloo）

>なにか方法はありますでしょうか？

手作業か、プログラムを作って自動か、その２種類しか有りません。

CMS、ブログ、BBSなども自動の一種です。

プログラムを作れないなら今まで通り手作業でやることになりますし、
もしくは、作ってもらえる知り合いがいるならその人に作ってもらうか、
ホームページ制作会社に依頼すれば（お金が要りますが）作ってもらえます。

デザインを自分で作れなくても良い、または改造する技術が有るなら、フリーのCGIプログラムを使う方法も有ります。
http://www.yumemaboroshi.net/cate95/

回答No.1

ORUKA1951

「5×5に収まりきれなくなったサムネイルは次のページ（5×5のレイアウトは変わらず）に移動させるつもり」
ということで、HTMLとCSSだけでは不可能です。PHPやCGIなどサーバーサイドのプログラムを使うことになるでしょう。
　ここは「Webデザイン・CSS」ですので、CGIなどから出力されたHTMLとそれに対するCSSのみ説明します。
★対象がイラストレーター達と言うことで、画像を使うことにします。
　・・・様々な訪問者を想定する場合は画像を配置しないほうが良い・・・

<div class="nav" id="imageList">
　<ol><!-- 順番が意識にあるようなので序列リストで -->
　　<li><a href="./image/1"><img src="./images/user1/IMG121106" width="240" height="180" alt="誰々さん"></a></li>
　　<li>・・・【中略】・・・</li>
　　<li><a href="./image/25"><img src="./images/user5/IMG120620" width="240" height="180" alt="誰々さん"></a></li>
　</ol>
　<p><a href="./">最初</a> | <a href="./p2">次</a></p>
</div>
とかをCGIで出力されるとします。

　後は、スタイルシートで、規定枠の中でそれぞれのリンクをブロックにしてfloatさせれば良いでしょう。

　そんなに多量でなければ、表示ブロックをoverflow:autoにして、スクロールで次を表示させるようにすれば良いと思います。ページ遷移も不要ですから