r50/index.html · 约 6292 字符
1<!doctype html>
2<html lang="zh-CN">
3<head>
4<meta charset="utf-8">
5<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
6<title>文件总览</title>
7<link rel="stylesheet" href="style.css">
8</head>
9<body>
10<div class="app">
11 <header class="top">
12 <div class="top-l">个人网盘 · 阿哲</div>
13 <div class="top-r">文件总览</div>
14 </header>
15 <main class="main">
16<div class="banner"><div class="b1">🗂️ 我的网盘</div>
17<div class="b2">已用 214.2 GB / 1 TB · 文件 1,286 个</div></div>
18<div class="seg" style="margin-bottom:12px" id="seg">
19 <div class="sg on" onclick="setView('grid',this)"><button>▦ 网格</button></div>
20 <div class="sg" onclick="setView('list',this)"><button>☰ 列表</button></div>
21</div>
22<div class="card view-grid" id="flist">
23 <div class="sec-title">最近文件</div>
24 <div class="grid"><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">档<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">2026年度预算表.xlsx</div></a><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">档<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">产品需求文档.docx</div></a><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">图<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">旅行照片合集.jpg</div></a><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">影<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">产品演示视频.mp4</div></a><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">档<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">项目会议纪要.pdf</div></a><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">图<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">UI设计稿.png</div></a><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">包<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">项目备份.zip</div></a><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">档<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">周报模板.pptx</div></a><a class="thumb gitem" href="detail.html" style="text-decoration:none;color:inherit;aspect-ratio:1;flex-direction:column;gap:6px">码<div style="font-size:11px;color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">前端源码.tar.gz</div></a></div>
25 <div style="margin-top:4px"><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">档</div><div class="info"><div class="nm">2026年度预算表.xlsx</div><div class="sub">1.2 MB · 07-16 14:20</div></div></a><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">档</div><div class="info"><div class="nm">产品需求文档.docx</div><div class="sub">386 KB · 07-15 09:11</div></div></a><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">图</div><div class="info"><div class="nm">旅行照片合集.jpg</div><div class="sub">4.8 MB · 07-14 21:03</div></div></a><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">影</div><div class="info"><div class="nm">产品演示视频.mp4</div><div class="sub">128 MB · 07-13 18:40</div></div></a><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">档</div><div class="info"><div class="nm">项目会议纪要.pdf</div><div class="sub">240 KB · 07-12 16:05</div></div></a><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">图</div><div class="info"><div class="nm">UI设计稿.png</div><div class="sub">2.1 MB · 07-11 11:30</div></div></a><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">包</div><div class="info"><div class="nm">项目备份.zip</div><div class="sub">56 MB · 07-10 22:15</div></div></a><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">档</div><div class="info"><div class="nm">周报模板.pptx</div><div class="sub">720 KB · 07-09 10:00</div></div></a><a class="guide litem" href="detail.html" style="text-decoration:none;color:inherit"><div class="thumb">码</div><div class="info"><div class="nm">前端源码.tar.gz</div><div class="sub">18 MB · 07-08 19:50</div></div></a></div>
26</div>
27<div class="card row"><div class="muted">📁 全部文件按类型自动归类</div><a class="btn sm" href="dir.html">浏览目录</a></div>
28<script>
29function setView(v,el){document.getElementById('flist').className='card view-'+v;document.querySelectorAll('#seg .sg').forEach(s=>s.classList.remove('on'));el.classList.add('on');}
30</script>
31</main>
32 <nav class="nav"><a class=" on" href="index.html"><span class="ic">🗂️</span>文件</a><a class="" href="up.html"><span class="ic">⬆</span>上传</a><a class="" href="shares.html"><span class="ic">🔗</span>分享</a><a class="" href="recycle.html"><span class="ic">🗑</span>回收</a><a class="" href="me.html"><span class="ic">⚙</span>我的</a></nav>
33</div>
34<script></script>
35</body>
36</html>