Skip to content

Add files via upload #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wangwenzhiwwz wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add files via upload #2

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 21 additions & 10 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -179,8 +179,8 @@

.app-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 30px;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* 自适应宽度，最小 200px */
gap: 20px; /* 减小间距 */
}

.app-item {
Expand All @@ -189,6 +189,8 @@
padding: 20px;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
transition: transform 0.3s;
height: 260px; /* 固定高度，确保一致 */
overflow: hidden; /* 超出隐藏 */
}

.app-item:hover {
Expand All @@ -199,6 +201,7 @@
text-decoration: none;
color: inherit;
display: block;
height: 100%; /* 占满容器 */
}

.app-icon {
Expand All @@ -212,11 +215,19 @@
font-size: 22px;
font-weight: 600;
margin-bottom: 10px;
white-space: nowrap; /* 单行 */
overflow: hidden;
text-overflow: ellipsis; /* 超出省略 */
}

.app-description {
font-size: 16px;
color: #6e6e73;
display: -webkit-box;
-webkit-line-clamp: 3; /* 限制 3 行 */
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}

#back-to-top {
Expand Down Expand Up @@ -299,11 +310,11 @@
/* 4K 大屏优化 */
@media (min-width: 2560px) {
.app-container {
max-width: 1920px;
max-width: 1920px; /* 4K 屏幕更大容器 */
}

.app-grid {
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* 自适应列数 */
}

.banner-container img {
Expand Down Expand Up @@ -331,6 +342,7 @@

.hamburger {
display: block;
margin-right: 15px;
}

.nav-links {
Expand Down Expand Up @@ -360,14 +372,14 @@
}

.app-grid {
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(2, 1fr); /* 手机端 2 列 */
gap: 10px;
}

.app-item {
padding: 10px;
width: 100%;
height: 160px;
height: 160px; /* 手机端固定高度 */
overflow: hidden;
}

Expand All @@ -387,7 +399,7 @@
.app-description {
font-size: 12px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-line-clamp: 2; /* 手机端 2 行 */
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
Expand Down Expand Up @@ -441,16 +453,15 @@
</a>
</div>
<div class="hero-content">
<h1>探索最佳应用</h1>
<p>发现为您精心挑选的应用程序，带来非凡体验。</p>
<h1>Best Apps</h1>
<p>Discover handpicked apps for a great experience.</p>
</div>
</div>

<div class="app-container" id="app-container"></div>

<button id="back-to-top" title="回到顶部">↑</button>

<!-- 引入外部 JS 文件 -->
<script src="apps.js"></script>
</body>
</html>