可以根据具体的域名自动显示，所有出售的域名可以放在同一个项目
事例：
http://genshin.sbs
http://18comic.sbs
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>高科技域名 - 引领未来</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap');
:root {
--primary-color: #00ff00;
--background-color: #0a0a0a;
--text-color: #ffffff;
--accent-color: #1e90ff;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Roboto', sans-serif;
background-color: var(--background-color);
color: var(--text-color);
line-height: 1.6;
min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 20px;
overflow-x: hidden;
}
.container {
max-width: 1000px;
width: 100%;
padding: 20px;
display: flex;
flex-direction: column;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
text-transform: uppercase;
letter-spacing: 2px;
text-align: center;
}
.domain-container {
background: linear-gradient(145deg, #0f0f0f, #1a1a1a);
border-radius: 15px;
padding: 40px;
margin: 40px 0;
box-shadow: 0 10px 30px rgba(0, 255, 0, 0.1);
text-align: center;
position: relative;
overflow: hidden;
}
.domain-name {
font-size: 4em;
font-weight: 700;
color: var(--primary-color);
margin-bottom: 20px;
text-shadow: 0 0 10px rgba(0, 255, 0, 0.5);
}
.domain-container::before {
content: '';
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: linear-gradient(
to bottom right,
rgba(0, 255, 0, 0.1) 0%,
rgba(0, 255, 0, 0) 100%
);
transform: rotate(45deg);
animation: shine 6s linear infinite;
}
@keyframes shine {
0% { transform: translateX(-100%) rotate(45deg); }
100% { transform: translateX(100%) rotate(45deg); }
}
p {
margin-bottom: 20px;
text-align: center;
max-width: 600px;
}
.cta-button {
display: inline-block;
padding: 12px 30px;
background-color: var(--primary-color);
color: var(--background-color);
text-decoration: none;
font-weight: bold;
text-transform: uppercase;
transition: all 0.3s ease;
border-radius: 5px;
}
.cta-button:hover {
background-color: var(--accent-color);
transform: translateY(-3px);
box-shadow: 0 5px 15px rgba(30, 144, 255, 0.3);
}
.features {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
margin-top: 40px;
width: 100%;
}
.feature {
background: linear-gradient(145deg, #0f0f0f, #1a1a1a);
border-radius: 10px;
padding: 20px;
text-align: center;
transition: all 0.3s ease;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
min-height: 150px;
}
.feature:hover {
transform: translateY(-5px);
box-shadow: 0 5px 15px rgba(0, 255, 0, 0.1);
}
.feature h3 {
color: var(--primary-color);
margin-bottom: 10px;
}
#countdown {
font-size: 1.5em;
margin-top: 20px;
color: var(--accent-color);
display: flex;
justify-content: center;
gap: 10px;
}
.time-unit {
display: inline-block;
background-color: rgba(30, 144, 255, 0.1);
padding: 5px 10px;
border-radius: 5px;
min-width: 60px;
text-align: center;
}
@media (max-width: 768px) {
.domain-name {
font-size: 3em;
}
.features {
grid-template-columns: 1fr;
}
}
</style>
</head>
<body>
<div class="container">
<h1>未来科技域名</h1>
<div class="domain-container">
<div class="domain-name" id="currentDomain"></div>
<p>抢占数字时代的制高点，这个域名将成为您技术创新的最佳代表。</p>
<a href="#" class="cta-button" id="contactLink">立即咨询</a>
</div>
<div id="countdown">
<span class="time-unit" id="hours"></span>:
<span class="time-unit" id="minutes"></span>:
<span class="time-unit" id="seconds"></span>
</div>
<div class="features">
<div class="feature">
<h3>高识别度</h3>
<p>简洁易记，提高品牌辨识度</p>
</div>
<div class="feature">
<h3>科技感强</h3>
<p>彰显高科技企业形象</p>
</div>
<div class="feature">
<h3>全球可用</h3>
<p>国际化品牌的最佳选择</p>
</div>
<div class="feature">
<h3>安全可靠</h3>
<p>提供安全的域名转移服务</p>
</div>
</div>
</div>
<script>
// 获取当前域名并显示
document.getElementById('currentDomain').textContent = window.location.hostname;
// 设置联系邮箱
document.getElementById('contactLink').href = 'mailto:改为自己的邮箱';
// 倒计时功能
function startCountdown() {
let time = 24 * 60 * 60; // 24小时
const hoursElement = document.getElementById('hours');
const minutesElement = document.getElementById('minutes');
const secondsElement = document.getElementById('seconds');
function updateCountdown() {
const hours = Math.floor(time / 3600);
const minutes = Math.floor((time % 3600) / 60);
const seconds = time % 60;
hoursElement.textContent = hours.toString().padStart(2, '0');
minutesElement.textContent = minutes.toString().padStart(2, '0');
secondsElement.textContent = seconds.toString().padStart(2, '0');
if (time > 0) {
time--;
setTimeout(updateCountdown, 1000);
} else {
document.getElementById('countdown').textContent = '优惠已结束';
}
}
updateCountdown();
}
startCountdown();
</script>
</body>
</html>
，原神死不死是吧！！！