フロントエンド div+css の専門家である私に、このlayout_html/css_WEB-ITnoseのデザイン方法を教えてください。

画像はレンダリングで、サムネイルと大きな画像は div+css を使用する必要があります。個人のフロントデスクは良くありません。


助けてくれてありがとう。

ディスカッションへの返信（解決策）

テーブルを使って直接実装するだけ

なお、それは良くないので自分でやる必要があります

でのサムネイルの実装方法がわかりません中央、コントロールを使用する必要がありますか?

ネットワーク速度が問題なく、サーバーの負荷が高くなければ、サムネイルを 780dcbe64dfc190eb33c0958a5656995 に設定するのは非常に簡単で、自動的にズームインおよびズームアウトされます

サムネイルはバックグラウンドで生成することも、jquery の autoIMG プラグインを使用して生成することもできます サムネイル

真ん中のものは実装が簡単です

 <style type="text/css">        div {            height:200px;            overflow-y:scroll;            outline:1px solid #ccc;        }        ul {            list-style-type:none;            padding-left:0;        }        li img {            vertical-align:middle;        }    </style>

 <div>       <ul>           <li>               <label><input type="checkbox" />序号</label> <img src="http://img1.cache.netease.com/cnews/2013/5/6/201305061059507553b.png" />           </li>           <li>               <label><input type="checkbox" />序号</label> <img src="http://img1.cache.netease.com/cnews/2013/5/6/201305061059507553b.png" />           </li>           <li>               <label><input type="checkbox" />序号</label> <img src="http://img1.cache.netease.com/cnews/2013/5/6/201305061059507553b.png" />           </li>           <li>               <label><input type="checkbox" />序号</label> <img src="http://img1.cache.netease.com/cnews/2013/5/6/201305061059507553b.png" />           </li>           <li>               <label><input type="checkbox" />序号</label> <img src="http://img1.cache.netease.com/cnews/2013/5/6/201305061059507553b.png" />           </li>           <li>               <label><input type="checkbox" />序号</label> <img src="http://img1.cache.netease.com/cnews/2013/5/6/201305061059507553b.png" />           </li>       </ul>   </div>