亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

ダウンロード數(shù)の統(tǒng)計(jì)を?qū)g裝し、HTML ページを作成するための PHP 開(kāi)発

index.html ページの本文に次の HTML 構(gòu)造を追加します。中央に表示される <div> タグに、表示する必要があるダウンロードされたコンテンツを追加します。部分はダウンロードしたファイルの名前とダウンロード數(shù)で、右側(cè)の部分にはマウスを移動(dòng)すると「クリックしてダウンロード」ボタンが表示されます。

ファイルリストを表示するために ul class="filelist" が使用されます。

ファイルリストを非同期的に読み取るために jQuery が使用されるため、ロードする必要があることを忘れないでください。 html 內(nèi)の jQuery ライブラリファイル。

<body>
<div id="header">
   <div id="logo" style="text-align: center"><h2>下載統(tǒng)計(jì)</h2></div>
</div>
<div id="main">
   <div id="demo">
       <ul class="filelist">
       </ul>
   </div>
</div>
<div id="footer">
</div>
</body>

如次の表のシンプルなスタイルレイアウトを?qū)g裝します。

head title: ダウンロード統(tǒng)計(jì) content ダウンロードコンテンツ 1: ダウンロードテスト 1.zip Number ofダウンロード例: 7 [クリックしてダウンロード] ボタンダウンロードされたコンテンツ 2 ..... ..... .....ダウンロードされたコンテンツ 3 … ….. … 下部のコンテンツ (コンテンツとスタイルを自分で追加できます) デモでページ効果をより適切に表示するために、CSS を使用して

以下のコードは主にファイルリストの表示効果を設(shè)定します。もちろん、実際のプロジェクトでは、必要に応じて対応するスタイルを設(shè)定できます。

HTML<head> 內(nèi)の <style> タグにさまざまな CSS スタイルコードを入力します。

學(xué)び続ける

新しいファイル

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>PHP實(shí)現(xiàn)文件下載次數(shù)統(tǒng)計(jì)</title> <style type="text/css"> #demo{width:80%;margin:50px auto;padding:10px;border:1px solid #ddd;background-color:#eee;} ul.filelist li{background:url("https://img.php.cn/upload/course/000/000/008/582e53ad28601855.gif") repeat-x center bottom #F5F5F5; border:1px solid #ddd;border-top-color:#fff;list-style:none;position:relative;} ul.filelist li.load{background:url("https://img.php.cn/upload/course/000/000/008/582e5313d54a1210.gif") no-repeat; padding-left:20px; border:none; position:relative; left:150px; top:30px; width:200px} ul.filelist li a{display:block;padding:8px;} ul.filelist li a:hover .download{display:block;} span.download{background-color:#64b126;border:1px solid #4e9416;color:white; display:none;font-size:12px;padding:2px 4px;position:absolute;right:8px; text-decoration:none;text-shadow:0 0 1px #315d0d;top:6px; -moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;} span.downcount{color:#999;font-size:10px;padding:3px 5px;position:absolute; margin-left:10px;text-decoration:none;} </style> </head> <body> <div id="header"> <div id="logo" style="text-align: center"><h2>下載統(tǒng)計(jì)</h2></div> </div> <div id="main"> <div id="demo"> <ul class="filelist"> </ul> </div> </div> <div id="footer"> </div> </body> </html>

提出するリセットコード

自動(dòng)運(yùn)転