xuyue/home
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix
Some checks failed
Deploy / build-and-deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
yuetsh
2025-09-05 13:01:36 +08:00
parent 023e79dd4f
commit 79a7f4d25a
2 changed files with 36 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
index.html
View File

@@ -9,30 +9,29 @@
<body>
<div id="app">
<!-- 左侧广告 -->
<div class="ad-left">
<div class="ad-content">
<h3 class="ad-title-shake">
<div class="promo-left">
<div class="promo-content">
<h3 class="promo-title-shake">
🔥 🔞游<span class="heart-shake">♥</span>戏<span
class="heart-shake"
>♥</span
>推<span class="heart-shake">♥</span>荐 🔥
</h3>
<p class="ad-text-shake">
<p class="promo-text-shake">
爸<span class="heart-shake">♥</span>妈<span class="heart-shake"
>♥</span
>不<span class="heart-shake">♥</span>在<span class="heart-shake"
>♥</span
>家
</p>
<p class="ad-text-shake">
<p class="promo-text-shake">
一<span class="heart-shake">♥</span>个<span class="heart-shake"
>♥</span
>人<span class="heart-shake">♥</span>寂<span class="heart-shake"
>♥</span
>寞<span class="heart-shake">♥</span>？
</p>
<div class="ad-placeholder">
<div class="promo-placeholder">
<div class="game-ad">
<div class="language-list">
<div class="game-title game-title-shake">
@@ -63,7 +62,7 @@
>♥</span
>体<span class="heart-shake">♥</span>验
</div>
<div class="ad-rental game-subtitle-shake">
<div class="promo-rental game-subtitle-shake">
广<span class="heart-shake">♥</span>告<span class="heart-shake"
>♥</span
>位<span class="heart-shake">♥</span>出<span
@@ -100,30 +99,30 @@
</div>
<!-- 右侧广告 -->
<div class="ad-right">
<div class="ad-content">
<h3 class="ad-title-shake">
<div class="promo-right">
<div class="promo-content">
<h3 class="promo-title-shake">
🎮 游<span class="heart-shake">♥</span>戏<span class="heart-shake"
>♥</span
>时<span class="heart-shake">♥</span>间<span class="heart-shake"
>♥</span
>到 🎮
</h3>
<p class="ad-text-shake">
<p class="promo-text-shake">
爸<span class="heart-shake">♥</span>妈<span class="heart-shake"
>♥</span
>不<span class="heart-shake">♥</span>在<span class="heart-shake"
>♥</span
>家
</p>
<p class="ad-text-shake">
<p class="promo-text-shake">
一<span class="heart-shake">♥</span>个<span class="heart-shake"
>♥</span
>人<span class="heart-shake">♥</span>寂<span class="heart-shake"
>♥</span
>寞<span class="heart-shake">♥</span>？
</p>
<div class="ad-placeholder">
<div class="promo-placeholder">
<div class="game-ad">
<div class="language-list">
<div class="game-title game-title-shake">
@@ -154,7 +153,7 @@
>♥</span
>体<span class="heart-shake">♥</span>验
</div>
<div class="ad-rental game-subtitle-shake">
<div class="promo-rental game-subtitle-shake">
广<span class="heart-shake">♥</span>告<span class="heart-shake"
>♥</span
>位<span class="heart-shake">♥</span>出<span

45
style.css
View File

@@ -64,9 +64,8 @@ a:hover {
box-sizing: border-box;
}
/* 广告区域样式 */
.ad-left,
.ad-right {
.promo-left,
.promo-right {
width: 350px;
min-height: 100vh;
position: fixed;
@@ -77,15 +76,15 @@ a:hover {
justify-content: center;
}
.ad-left {
.promo-left {
left: 0;
}
.ad-right {
.promo-right {
right: 0;
}
.ad-content {
.promo-content {
background: rgba(255, 255, 255, 0.9);
border: 2px solid rgba(255, 182, 193, 0.3);
border-radius: 15px;
@@ -97,21 +96,21 @@ a:hover {
animation: adFloat 3s ease-in-out infinite, adShake 2s ease-in-out infinite, adFlash 1.5s ease-in-out infinite;
}
.ad-content h3 {
.promo-content h3 {
color: #ff69b4;
font-size: 1.6rem;
margin: 0 0 0.5rem 0;
text-shadow: 1px 1px 2px rgba(255, 105, 180, 0.3);
}
.ad-content p {
.promo-content p {
color: #9370db;
font-size: 1.2rem;
margin: 0.3rem 0;
text-shadow: 1px 1px 2px rgba(147, 112, 219, 0.3);
}
.ad-placeholder {
.promo-placeholder {
width: 300px;
height: 300px;
background: linear-gradient(135deg, rgba(255, 182, 193, 0.3) 0%, rgba(221, 160, 221, 0.3) 100%);
@@ -154,7 +153,7 @@ a:hover {
text-shadow: 1px 1px 2px rgba(147, 112, 219, 0.3);
}
.ad-rental {
.promo-rental {
font-size: 1rem;
color: #ff69b4;
margin-top: 0.5rem;
@@ -210,8 +209,8 @@ a:hover {
margin: 0 0.1em;
}
.ad-title-shake,
.ad-text-shake,
.promo-title-shake,
.promo-text-shake,
.game-title-shake,
.game-subtitle-shake,
.play-button-shake {
@@ -606,8 +605,8 @@ a:hover {
}
@media (max-width: 600px) {
.ad-left,
.ad-right {
.promo-left,
.promo-right {
display: none;
}
@@ -639,8 +638,8 @@ a:hover {
}
@media (max-width: 1600px) {
.ad-left,
.ad-right {
.promo-left,
.promo-right {
width: 300px;
}
@@ -648,15 +647,15 @@ a:hover {
margin: 0 320px;
}
.ad-placeholder {
.promo-placeholder {
width: 250px;
height: 400px;
}
}
@media (max-width: 1400px) {
.ad-left,
.ad-right {
.promo-left,
.promo-right {
width: 250px;
}
@@ -664,15 +663,15 @@ a:hover {
margin: 0 270px;
}
.ad-placeholder {
.promo-placeholder {
width: 200px;
height: 350px;
}
}
@media (max-width: 1200px) {
.ad-left,
.ad-right {
.promo-left,
.promo-right {
width: 200px;
}
@@ -680,7 +679,7 @@ a:hover {
margin: 0 220px;
}
.ad-placeholder {
.promo-placeholder {
width: 160px;
height: 300px;
}