index.html ページの本文に次の HTML 構造を追加します。中央に表示される <div> タグに、表示する必要があるダウンロードされたコンテンツを追加します。部分はダウンロードしたファイルの名前とダウンロード数で、右側の部分にはマウスを移動すると「クリックしてダウンロード」ボタンが表示されます。
ファイルリストを表示するために ul class="filelist" が使用されます。
ファイルリストを非同期的に読み取るために jQuery が使用されるため、ロードする必要があることを忘れないでください。 html 内の jQuery ライブラリ ファイル。
<body> <div id="header"> <div id="logo" style="text-align: center"><h2>下载统计</h2></div> </div> <div id="main"> <div id="demo"> <ul class="filelist"> </ul> </div> </div> <div id="footer"> </div> </body>如 次の表のシンプルなスタイル レイアウトを実装します。
Number ofダウンロード例: 7 | [クリックしてダウンロード] ボタン | ダウンロードされたコンテンツ 2 | |
..... | ..... | ダウンロードされたコンテンツ 3 | |
….. | … | 下部のコンテンツ (コンテンツとスタイルを自分で追加できます) | |