RWKV7-G0a3 7.2B发布:迄今最强RNN,高并发vibe coding
2025 年 10 月 30 日, RWKV7-G0a3 7.2B 推理模型开源发布。它基于 RWKV7-G0a2 7.2B 继续训练高质量数据,显著提升能力。
RWKV 模型名称的 G1/G1a/G1a2/G0a3 等字段是训练数据的版本,数据质量 G#a3 > G#a2 > G#a > G#,数据数量 G1 > G0。简单规则:同一参数选择最新的模型,效果最好。
模型性能评估
MMLU & MMLU PRO
评估模型在多学科知识的综合能力(MMLU PRO 难度比 MMLU 更高)。
GSM8K
评估模型在中学难度数学应用题的推理能力。
MATH500
测试模型在更难数学问题的解题能力。
CEval
以多行业真实试题,评估模型中文理解和专业知识。
模型实战
G0a3 模型加入更多数据,显著提升 vibe coding 能力。回顾上版模型:RWKV7-G0a2 7.2B发布:纯RNN也能vibe coding
代码推荐解码参数:Temperature=1,Top_P=0.3,Presence Penalty=1,Frequency Penalty=0.1,decay=0.99
我们使用上次测试的 prompt:请生成一个蓝紫色主题(主色调为 #6A5ACD,辅助色为白色)的现代用户卡片组件。卡片内必须包含:1. 用户头像(圆形占位符);2. 用户名;3. 一句签名(使用斜体字);4. 一个蓝色关注按钮;5. 整体 布局居中。
然后把输出放到 https://html.onlineviewer.net/ 看效果,显著更好:
上次的第二个 vibe coding prompt:请给前沿科技媒体机器之心设计一个前沿风格网页,要求置顶部分滚动播出实时AI新闻。在抽卡几次后,G0a3 成功实现了滚动文字。
第三个 vibe coding prompt:请生成精美的HTML网页:鲁迅纪念馆
尝试更详细的 prompt: 请生成一个主题为“鲁迅纪念馆”的精美 HTML 网页,要求:* 包含顶部导航、横幅、展览介绍、鲁迅生平时间线、代表作品、纪念照片墙、参观信息、页脚 * 网页整体要符合纪念馆庄重、文化的气质,G0a3 模型遵循了指令:
所有生成的代码都在文末附录。我们会持续发布 vibe coding 能力显著更强的模型。
如前所述,RWKV作为纯RNN模型,尤其适合大规模并行生成:RWKV-7 7B单5090解码10000+ tok/s演示
我们提供了大规模并行生成网页的推理工具:
效果预览:
小说和故事创作
创作任务推荐的解码参数:Temperature=0.6,Top_P=0.7,Presence Penalty=2,Frequency Penalty=0.2
我们在新模型主蒸 DeepSeek v3.1,可以看到它的显著风格:
模型下载
下载 RWKV7-G0a3 7.2B 模型(.pth 格式):
- Hugging Face:https://huggingface.co/BlinkDL/rwkv7-g1/resolve/main/rwkv7-g0a3-7.2b-20251029-ctx8192.pth?download=true
- 魔搭:https://modelscope.cn/models/RWKV/rwkv7-g1/resolve/master/rwkv7-g0a3-7.2b-20251029-ctx8192.pth
- Wisemodel:https://download.wisemodel.cn/file-proxy/rwkv4fun/RWKV-7-G1/-/raw/main/rwkv7-g0a3-7.2b-20251029-ctx8192.pth?inline=false
下载 .gguf 格式:https://modelscope.cn/models/shoumenchougou/RWKV7-G0a3-7.2B-GGUF/files
下载 Ollama 格式:https://ollama.com/mollysama
如何使用 RWKV 模型
我们提供在线 demo,也提供本地部署的教程。
在线 demo(续写模式)
可在 RWKV 官方 Demo 中试用 RWKV7-G0a3 7.2B 模型:
- Hugging Face Gradio Demo:https://huggingface.co/spaces/BlinkDL/RWKV-Gradio-2
本地部署
可以使用 RWKV Runner、Ai00、RWKV pip 等推理工具本地部署 RWKV 模型。
以及目前最快的推理方式 Albatross:https://github.com/BlinkDL/Albatross
此外,RWKV 模型也适配了 llama.cpp、ollama 等热门的模型推理工具。
由于 RWKV7-G0a3 7.2B 是新模型,目前建议使用 RWKV Runner 以保证得到正确结果。
可以在 RWKV 官网 - 模型推理教程中查看上述推理工具的使用教程。
加入 RWKV 社区
欢迎大家加入 RWKV 社区,可以从 RWKV 中文官网了解 RWKV 模型,也可以加入 RWKV 论坛、QQ 频道和 QQ 群聊,一起探讨 RWKV 模型。
- 📖 RWKV 中文文档:https://www.rwkv.cn
- 💬 RWKV 论坛:https://community.rwkv.cn/
- 🐧 QQ 频道:https://pd.qq.com/s/9n21eravc | QQ 交流群:224287095
- 📺 BiliBili 视频教程:https://space.bilibili.com/3546689096910933
欢迎大家基于 RWKV-7 进行创业、科研,我们也会为基于 RWKV 的项目提供技术支持。
如果您的团队正在基于 RWKV 创业或开展研究,请联系我们!(在“RWKV元始智能”微信公众号留言您的联系方式,或发送邮件到“contact@rwkvos.com”。)
附录代码
vibe coding prompt:请生成一个蓝紫色主题(主色调为 #6A5ACD,辅助色为白色)的现代用户卡片组件。卡片内必须包含:1. 用户头像(圆形占位符);2. 用户名;3. 一句签名(使用斜体字);4. 一个蓝色关注按钮;5. 整体布局居中。
<!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>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
body {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d);
padding: 20px;
}
.user-card {
background: rgba(255, 255, 255, 0.95);
border-radius: 20px;
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
padding: 30px;
max-width: 400px;
width: 100%;
text-align: center;
transition: transform 0.3s ease;
}
.user-card:hover {
transform: translateY(-10px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}
.avatar {
width: 120px;
height: 120px;
border-radius: 50%;
background: linear-gradient(45deg, #6a5acd, #4a7bc9);
display: flex;
justify-content: center;
align-items: center;
font-size: 48px;
color: white;
margin: 0 auto 20px;
border: 4px solid #4a7bc9;
}
.username {
font-size: 28px;
font-weight: 600;
margin-bottom: 10px;
color: #4a7bc9;
}
.signature {
font-style: italic;
color: #666;
margin-bottom: 25px;
line-height: 1.5;
}
.follow-btn {
display: inline-block;
background: linear-gradient(45deg, #4a7bc9, #6a5acd);
color: white;
padding: 12px 30px;
border-radius: 50px;
text-decoration: none;
font-weight: 600;
font-size: 16px;
transition: all 0.3s ease;
border: none;
cursor: pointer;
position: relative;
overflow: hidden;
}
.follow-btn::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
transition: all 0.5s ease;
}
.follow-btn:hover {
transform: translateY(-3px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
.follow-btn:hover::before {
left: 100%;
}
.social-icons {
display: flex;
justify-content: center;
gap: 15px;
margin-top: 20px;
}
.social-icon {
width: 40px;
height: 40px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.2);
display: flex;
justify-content: center;
align-items: center;
color: white;
font-size: 18px;
cursor: pointer;
transition: all 0.3s ease;
}
.social-icon:hover {
background: rgba(255, 255, 255, 0.4);
transform: scale(1.1);
}
.tagline {
font-style: italic;
color: #aaa;
margin-top: 10px;
font-size: 14px;
}
@media (max-width: 600px) {
.user-card {
padding: 20px;
}
.avatar {
width: 80px;
height: 80px;
font-size: 36px;
}
.username {
font-size: 22px;
}
.signature {
font-size: 14px;
}
}
</style>
</head>
<body>
<div class="user-card">
<div class="avatar">👤</div>
<h2 class="username">小明</h2>
<p class="signature">"探索世界,发现美好"</p>
<a href="#" class="follow-btn">关注</a>
<div class="social-icons">
<div class="social-icon">📸</div>
<div class="social-icon">🎵</div>
<div class="social-icon">📚</div>
<div class="social-icon">🎮</div>
</div>
<p class="tagline">"每一天都是新的开始"</p>
</div>
</body>
</html>
vibe coding prompt:请给前沿科技媒体机器之心设计一个前沿风格网页,要求置顶部分滚动播出实时AI新闻
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>机器之心 - AI前沿动态</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
:root {
--primary: #007bff;
--secondary: #ff6b6b;
--dark: #1a1a2e;
--light: #f8f9fa;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', system-ui, sans-serif;
}
body {
background: linear-gradient(135deg, var(--dark) 0%, #16213e 100%);
color: white;
overflow-x: hidden;
}
/* 顶部滚动新闻区 */
.news-ticker {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 80px;
background: rgba(0, 0, 0, 0.9);
display: flex;
align-items: center;
padding: 0 20px;
z-index: 1000;
backdrop-filter: blur(10px);
}
.ticker-content {
flex: 1;
overflow: hidden;
white-space: nowrap;
}
.ticker-item {
display: inline-block;
padding: 0 15px;
height: 100%;
line-height: 80px;
font-size: 14px;
opacity: 0.8;
animation: ticker 30s linear infinite;
}
@keyframes ticker {
0% { transform: translateX(-100%); }
100% { transform: translateX(100%); }
}
/* 导航栏 */
nav {
position: sticky;
top: 0;
background: rgba(0, 0, 0, 0.95);
padding: 15px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.nav-container {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo {
font-size: 24px;
font-weight: 700;
color: var(--primary);
text-decoration: none;
}
.nav-links {
display: flex;
list-style: none;
}
.nav-links li {
margin-left: 30px;
}
.nav-links a {
color: white;
text-decoration: none;
transition: color 0.3s;
}
.nav-links a:hover {
color: var(--secondary);
}
/* 主内容区 */
.hero {
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
padding: 0 20px;
}
.hero-content {
max-width: 800px;
}
h1 {
font-size: 4rem;
margin-bottom: 20px;
background: linear-gradient(90deg, var(--primary), var(--secondary));
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.subtitle {
font-size: 1.5rem;
margin-bottom: 40px;
opacity: 0.9;
}
.cta-button {
display: inline-block;
padding: 12px 30px;
background: var(--primary);
color: white;
text-decoration: none;
border-radius: 50px;
font-weight: 600;
transition: all 0.3s;
}
.cta-button:hover {
transform: translateY(-3px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
/* 内容区域 */
.content-section {
padding: 80px 20px;
max-width: 1200px;
margin: 0 auto;
}
.section-title {
text-align: center;
margin-bottom: 40px;
font-size: 2.5rem;
color: var(--primary);
}
.article-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 30px;
}
.article-card {
background: rgba(255, 255, 255, 0.05);
border-radius: 15px;
padding: 25px;
transition: transform 0.3s;
}
.article-card:hover {
transform: translateY(-10px);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
}
.article-image {
width: 100%;
height: 200px;
object-fit: cover;
border-radius: 10px;
margin-bottom: 15px;
}
.article-title {
font-size: 1.5rem;
margin-bottom: 10px;
color: var(--primary);
}
.article-meta {
display: flex;
justify-content: space-between;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
}
/* 底部 */
footer {
background: rgba(0, 0, 0, 0.9);
padding: 40px 20px;
text-align: center;
}
.footer-content {
max-width: 1200px;
margin: 0 auto;
}
.social-links {
display: flex;
justify-content: center;
gap: 20px;
margin: 30px 0;
}
.social-links a {
color: white;
font-size: 1.5rem;
transition: color 0.3s;
}
.social-links a:hover {
color: var(--secondary);
}
.copyright {
margin-top: 30px;
font-size: 0.9rem;
opacity: 0.7;
}
</style>
</head>
<body>
<!-- 顶部滚动新闻 -->
<div class="news-ticker">
<div class="ticker-content">
<div class="ticker-item">
<span class="ticker-text">GPT-5预计2024年Q3发布,模型规模达万亿参数</span>
</div>
<div class="ticker-item">
<span class="ticker-text">DeepMind推出AlphaFold 3,突破蛋白质结构预测极限</span>
</div>
<div class="ticker-item">
<span class="ticker-text">OpenAI与微软达成战略合作,共建AI安全框架</span>
</div>
<div class="ticker-item">
<span class="ticker-text">MIT发布脑机接口新突破,实现人机思维直接交互</span>
</div>
<div class="ticker-item">
<span class="ticker-text">中国科学院发布《人工智能伦理白皮书》</span>
</div>
</div>
</div>
<!-- 导航栏 -->
<nav>
<div class="nav-container">
<a href="#" class="logo">机器之心</a>
<ul class="nav-links">
<li><a href="#">首页</a></li>
<li><a href="#">热点</a></li>
<li><a href="#">资讯</a></li>
<li><a href="#">技术</a></li>
<li><a href="#">产业</a></li>
<li><a href="#">观点</a></li>
</ul>
</div>
</nav>
<!-- 主内容区 -->
<main class="hero">
<div class="hero-content">
<h1>AI正在重塑世界</h1>
<p class="subtitle">从自动驾驶到生物医药,人工智能正在引领第四次工业革命</p>
<a href="#" class="cta-button">探索最新AI技术</a>
</div>
</main>
<!-- 内容区域 -->
<div class="content-section">
<div class="section-title">热点头条</div>
<div class="article-grid">
<!-- 文章卡片将通过JavaScript动态生成 -->
</div>
</div>
<!-- 底部 -->
<footer>
<div class="footer-content">
<div class="social-links">
<a href="#"><i class="fab fa-twitter"></i></a>
<a href="#"><i class="fab fa-facebook"></i></a>
<a href="#"><i class="fab fa-linkedin"></i></a>
<a href="#"><i class="fab fa-youtube"></i></a>
</div>
<p>© 2023 机器之心 | 版权所有</p>
</div>
</footer>
<script>
// 滚动新闻动画
document.addEventListener('DOMContentLoaded', function() {
const tickerItems = document.querySelectorAll('.ticker-item');
// 创建滚动新闻效果
function createTicker() {
tickerItems.forEach((item, index) => {
setTimeout(() => {
item.classList.add('active');
}, index * 500);
});
}
// 初始化滚动新闻
createTicker();
// 滚动监听
window.addEventListener('scroll', function() {
const scrollY = window.scrollY;
const totalHeight = document.documentElement.scrollHeight - window.innerHeight;
const scrollPercent = (scrollY / totalHeight) * 100;
// 根据滚动位置调整新闻动画速度
tickerItems.forEach((item, index) => {
const speed = Math.max(0, 1 - (scrollPercent / 100)) * 0.5;
item.style.animationDuration = `${speed}s`;
});
});
});
</script>
</body>
</html>
vibe coding prompt:请生成精美的HTML网页:鲁迅纪念馆
<!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>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "SimSun", "宋体", serif;
}
body {
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
color: #e6e6e6;
line-height: 1.6;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
header {
text-align: center;
padding: 60px 0 40px;
border-bottom: 2px solid #c19a6b;
margin-bottom: 40px;
}
.logo {
font-size: 3.5rem;
color: #d4af37;
text-shadow: 0 0 15px rgba(209, 167, 59, 0.5);
margin-bottom: 20px;
}
.subtitle {
font-size: 1.5rem;
color: #a89f7a;
letter-spacing: 5px;
}
nav {
display: flex;
justify-content: center;
gap: 30px;
margin-bottom: 40px;
}
nav a {
color: #d4af37;
text-decoration: none;
font-weight: bold;
transition: all 0.3s ease;
}
nav a:hover {
color: #ffd700;
transform: translateY(-5px);
}
.main-content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px;
margin-bottom: 60px;
}
@media (max-width: 768px) {
.main-content {
grid-template-columns: 1fr;
}
}
.card {
background: rgba(255, 255, 255, 0.05);
border-radius: 10px;
padding: 30px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
transition: transform 0.3s ease;
}
.card:hover {
transform: translateY(-10px);
}
.card h2 {
color: #d4af37;
margin-bottom: 20px;
border-bottom: 1px solid #333;
padding-bottom: 10px;
}
.exhibit-gallery {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 20px;
margin-top: 30px;
}
.exhibit-item {
background: rgba(0, 0, 0, 0.3);
border-radius: 8px;
overflow: hidden;
position: relative;
}
.exhibit-image {
width: 100%;
height: 180px;
object-fit: cover;
transition: transform 0.5s ease;
}
.exhibit-item:hover .exhibit-image {
transform: scale(1.1);
}
footer {
text-align: center;
padding: 40px 0;
border-top: 1px solid #333;
margin-top: 60px;
color: #888;
}
.timeline {
position: relative;
max-width: 800px;
margin: 40px auto;
}
.timeline::after {
content: '';
position: absolute;
width: 6px;
background-color: #d4af37;
top: 0;
bottom: 0;
left: 50%;
margin-left: -3px;
}
.timeline-item {
padding: 10px 40px;
position: relative;
width: 50%;
box-sizing: border-box;
}
.timeline-item::after {
content: '';
position: absolute;
width: 20px;
height: 20px;
background-color: #fff;
border: 4px solid #d4af37;
top: 15px;
border-radius: 50%;
z-index: 1;
}
.left {
left: 0;
}
.right {
left: 50%;
}
.left::before, .right::before {
content: "";
position: absolute;
top: 15px;
width: 20px;
height: 20px;
background-color: #d4af37;
border: 4px solid #fff;
border-radius: 50%;
z-index: 1;
}
.left::before {
left: -10px;
}
.right::before {
right: -10px;
}
.timeline-content {
padding: 20px;
background-color: rgba(209, 167, 59, 0.1);
border-radius: 8px;
}
.timeline-date {
font-weight: bold;
color: #d4af37;
margin-bottom: 5px;
}
.quote-carousel {
position: relative;
height: 300px;
overflow: hidden;
}
.carousel-track {
display: flex;
transition: transform 0.5s ease;
}
.carousel-slide {
min-width: 100%;
padding: 20px;
background: rgba(209, 167, 59, 0.1);
border-radius: 8px;
}
.carousel-controls {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 100%;
display: flex;
justify-content: space-between;
padding: 0 20px;
}
.carousel-btn {
background: rgba(209, 167, 59, 0.3);
border: none;
color: white;
width: 40px;
height: 40px;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.carousel-indicators {
display: flex;
justify-content: center;
margin-top: 20px;
}
.indicator {
width: 12px;
height: 12px;
border-radius: 50%;
background: #ccc;
margin: 0 5px;
cursor: pointer;
}
.indicator.active {
background: #d4af37;
}
</style>
</head>
<body>
<div class="container">
<header>
<h1 class="logo">鲁迅纪念馆</h1>
<p class="subtitle">永恒的精神灯塔</p>
</header>
<nav>
<a href="#history">历史背景</a>
<a href="#personage">人物介绍</a>
<a href="#exhibition">展览信息</a>
<a href="#interact">互动体验</a>
</nav>
<div class="main-content">
<div class="card">
<h2>鲁迅简介</h2>
<p>周树人(1881年9月25日-1936年10月19日),字豫山,后改名为豫才,笔名鲁迅,浙江绍兴人,中国现代文学家、思想家、革命家。他是中国现代文学的奠基人之一,被誉为"民族魂"。</p>
<p>鲁迅的作品以深刻的社会批判和独特的艺术风格著称,代表作有《呐喊》、《彷徨》、《故事新编》等。他的思想影响了一代又一代中国人,至今仍具有强烈的现实意义。</p>
</div>
<div class="card">
<h2>纪念馆概况</h2>
<p>鲁迅纪念馆位于浙江省绍兴市柯桥区,是中国第一座以纪念鲁迅为主题的专题纪念馆。馆内陈列着鲁迅生前使用过的文房四宝、手稿、照片等珍贵文物,还展示了鲁迅的生平事迹和思想发展历程。</p>
<p>纪念馆建筑融合了中国传统园林风格与现代建筑元素,营造出浓厚的文化氛围。游客可以在这里感受到鲁迅的精神世界,领略中国近代文学的辉煌。</p>
</div>
</div>
<div class="exhibit-gallery">
<div class="exhibit-item">
<img src="https://via.placeholder.com/300x200?text=鲁迅手稿" alt="鲁迅手稿">
<div class="exhibit-info">
<h3>《狂人日记》手稿</h3>
<p>中国现代文学史上第一篇白话小说</p>
</div>
</div>
<div class="exhibit-item">
<img src="https://via.placeholder.com/300x200?text=鲁迅照片" alt="鲁迅照片">
<div class="exhibit-info">
<h3>青年时期照片</h3>
<p>1904年,鲁迅在日本留学时的照片</p>
</div>
</div>
<div class="exhibit-item">
<img src="https://via.placeholder.com/300x200?text=鲁迅书房" alt="鲁迅书房">
<div class="exhibit-info">
<h3>书房陈列</h3>
<p>展示鲁迅生前使用的文房四宝</p>
</div>
</div>
</div>
<div class="timeline">
<div class="timeline-track">
<div class="timeline-item left">
<div class="timeline-content">
<div class="timeline-date">1902年</div>
<p>鲁迅赴日本留学,开始接触西方文化</p>
</div>
</div>
<div class="timeline-item right">
<div class="timeline-content">
<div class="timeline-date">1918年</div>
<p>发表《狂人日记》,中国现代文学诞生</p>
</div>
</div>
<div class="timeline-item left">
<div class="timeline-content">
<div class="timeline-date">1926年</div>
<p>创办《语丝》周刊,推动新文化运动</p>
</div>
</div>
<div class="timeline-item right">
<div class="timeline-content">
<div class="timeline-date">1936年</div>
<p>鲁迅逝世,享年55岁</p>
</div>
</div>
</div>
</div>
<div class="quote-carousel">
<div class="carousel-track">
<div class="carousel-slide">
<p>"我以为,只要有爱,就有希望。"</p>
<p>- 鲁迅《野草》</p>
</div>
<div class="carousel-slide">
<p>"我们不能忘记,我们曾经拥有过的光明。"</p>
<p>- 鲁迅《坟》</p>
</div>
<div class="carousel-slide">
<p>"我以为,真正的自由,是敢于直面黑暗的勇气。"</p>
<p>- 鲁迅《阿Q正传》</p>
</div>
</div>
<div class="carousel-controls">
<button id="prevBtn"><</button>
<button id="nextBtn">></button>
</div>
</div>
<footer>
<p>鲁迅纪念馆 © 2023 | 浙江省绍兴市柯桥区</p>
<p>电话:0575-82288888 | 邮箱:luxunmuseum@example.com</p>
</footer>
</div>
<script>
// 简单的轮播图功能
document.addEventListener('DOMContentLoaded', function() {
const slides = document.querySelectorAll('.carousel-slide');
const prevBtn = document.getElementById('prevBtn');
const nextBtn = document.getElementById('nextBtn');
let currentSlide = 0;
function showSlide(n) {
slides.forEach((slide, index) => {
slide.style.transform = `translateX(${n * 100}%)`;
});
}
prevBtn.addEventListener('click', () => {
currentSlide = (currentSlide - 1 + slides.length) % slides.length;
showSlide(currentSlide);
});
nextBtn.addEventListener('click', () => {
currentSlide = (currentSlide + 1) % slides.length;
showSlide(currentSlide);
});
// 初始显示第一张幻灯片
showSlide(0);
});
</script>
</body>
</html>
vibe coding prompt: 请生成一个主题为“鲁迅纪念馆”的精美 HTML 网页,要求:* 包含顶部导航、横幅、展览介绍、鲁迅生平时间线、代表作品、纪念照片墙、参观信息、页脚 * 网页整体要符合纪念馆庄重、文化的气质
<!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>
/* 基础样式 */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "SimSun", "宋体", serif;
}
body {
background-color: #f5f2e9;
color: #333;
line-height: 1.6;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
/* 头部样式 */
header {
background: linear-gradient(to bottom, #8b0000, #5a0000);
color: #fff;
padding: 40px 0;
text-align: center;
position: relative;
overflow: hidden;
}
header::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M50,5 C60,15 70,25 80,35 A70,70 0 0,1 20,35 C30,25 40,15 50,5 Z" fill="%238b0000" opacity="0.3"/></svg>');
opacity: 0.1;
}
.logo {
font-size: 3.5rem;
font-weight: bold;
margin-bottom: 10px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
letter-spacing: 5px;
}
.subtitle {
font-size: 1.5rem;
font-weight: normal;
margin-bottom: 30px;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}
/* 导航栏 */
nav {
background-color: #5a0000;
padding: 15px 0;
position: sticky;
top: 0;
z-index: 100;
}
nav ul {
display: flex;
justify-content: center;
list-style: none;
}
nav li {
margin: 0 20px;
}
nav a {
color: #fff;
text-decoration: none;
font-size: 1.1rem;
transition: color 0.3s;
}
nav a:hover {
color: #ffd700;
}
/* 横幅区域 */
.banner {
background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400"><rect width="800" height="400" fill="%235a0000"/><text x="400" y="200" font-family="SimSun" font-size="24" text-anchor="middle" fill="%23ffd700" dy="0.3em">鲁迅纪念馆</text></svg>');
background-size: cover;
background-position: center;
color: #fff;
text-align: center;
padding: 100px 20px;
min-height: 400px;
}
.banner h1 {
font-size: 3.5rem;
margin-bottom: 20px;
text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.8);
}
.banner p {
font-size: 1.2rem;
max-width: 800px;
margin: 0 auto 30px;
}
/* 展览介绍 */
.exhibition {
padding: 60px 0;
background-color: #f9f5eb;
}
.exhibition h2 {
text-align: center;
font-size: 2.5rem;
margin-bottom: 40px;
color: #5a0000;
border-bottom: 2px solid #8b0000;
padding-bottom: 15px;
}
.exhibition-content {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
gap: 30px;
}
.exhibition-item {
flex: 1 1 300px;
background-color: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
text-align: center;
}
.exhibition-item h3 {
font-size: 1.5rem;
margin-bottom: 15px;
color: #5a0000;
}
/* 生平时间线 */
.timeline {
padding: 60px 0;
background-color: #f9f5eb;
}
.timeline h2 {
text-align: center;
font-size: 2.5rem;
margin-bottom: 40px;
color: #5a0000;
border-bottom: 2px solid #8b0000;
padding-bottom: 15px;
}
.timeline-container {
position: relative;
max-width: 800px;
margin: 0 auto;
}
.timeline-item {
position: relative;
margin-bottom: 40px;
width: 100%;
}
.timeline-item::after {
content: '';
position: absolute;
width: 20px;
height: 20px;
background-color: #8b0000;
border-radius: 50%;
top: 20px;
left: 50%;
transform: translateX(-50%);
}
.timeline-content {
padding: 20px;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
}
.timeline-date {
font-weight: bold;
color: #8b0000;
margin-bottom: 10px;
}
/* 代表作品 */
.works {
padding: 60px 0;
background-color: #f9f5eb;
}
.works h2 {
text-align: center;
font-size: 2.5rem;
margin-bottom: 40px;
color: #5a0000;
border-bottom: 2px solid #8b0000;
padding-bottom: 15px;
}
.works-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 30px;
}
.work-card {
background-color: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
transition: transform 0.3s;
}
.work-card:hover {
transform: translateY(-10px);
}
.work-img {
width: 100%;
height: 200px;
object-fit: cover;
}
.work-content {
padding: 20px;
}
.work-title {
font-size: 1.3rem;
margin-bottom: 10px;
color: #5a0000;
}
/* 纪念照片墙 */
.photo-wall {
padding: 60px 0;
background-color: #f9f5eb;
}
.photo-wall h2 {
text-align: center;
font-size: 2.5rem;
margin-bottom: 40px;
color: #5a0000;
border-bottom: 2px solid #8b0000;
padding-bottom: 15px;
}
.photos {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
}
.photo {
width: 250px;
height: 350px;
background-color: #8b0000;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 1.2rem;
cursor: pointer;
transition: transform 0.3s;
}
.photo:hover {
transform: scale(1.05);
}
/* 参观信息 */
.visit-info {
padding: 60px 0;
background-color: #f9f5eb;
}
.visit-info h2 {
text-align: center;
font-size: 2.5rem;
margin-bottom: 40px;
color: #5a0000;
border-bottom: 2px solid #8b0000;
padding-bottom: 15px;
}
.visit-details {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
gap: 30px;
}
.visit-card {
flex: 1 1 300px;
background-color: #fff;
border-radius: 8px;
padding: 20px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.visit-card h3 {
font-size: 1.5rem;
margin-bottom: 15px;
color: #5a0000;
}
/* 页脚 */
footer {
background-color: #5a0000;
color: #fff;
padding: 40px 0 20px;
}
.footer-content {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.footer-section {
flex: 1 1 250px;
margin-bottom: 30px;
}
.footer-section h3 {
font-size: 1.2rem;
margin-bottom: 15px;
color: #ffd700;
}
.footer-section p {
margin-bottom: 10px;
}
.copyright {
text-align: center;
padding-top: 20px;
border-top: 1px solid #444;
font-size: 0.9rem;
color: #aaa;
}
/* 响应式设计 */
@media (max-width: 768px) {
.logo {
font-size: 2.5rem;
}
.banner h1 {
font-size: 2.5rem;
}
.exhibition-content, .works-grid, .visit-details {
flex-direction: column;
}
.timeline-item {
flex-direction: column;
align-items: flex-start;
}
.timeline-content {
margin-left: 0;
margin-top: 20px;
}
}
</style>
</head>
<body>
<!-- 顶部导航 -->
<header>
<div class="container">
<nav>
<ul>
<li><a href="#home">首页</a></li>
<li><a href="#exhibition">展览</a></li>
<li><a href="#timeline">生平</a></li>
<li><a href="#works">作品</a></li>
<li><a href="#photos">照片墙</a></li>
<li><a href="#visit">参观信息</a></li>
</ul>
</nav>
<div class="banner">
<h1>鲁迅纪念馆</h1>
<p>致敬文学巨匠,传承革命精神</p>
</div>
</div>
</header>
<!-- 横幅区域 -->
<section class="banner" id="home">
<div class="container">
<h2>鲁迅纪念馆</h2>
<p>中国现代文学史上最重要的作家之一,中国共产党早期领导人之一,伟大的民族解放运动战士。</p>
</div>
</section>
<!-- 展览介绍 -->
<section class="exhibition" id="exhibition">
<div class="container">
<h2>展览介绍</h2>
<div class="exhibition-content">
<div class="exhibition-item">
<h3>鲁迅生平</h3>
<p>鲁迅(1881年9月25日-1936年10月19日),原名周树人,字豫山、豫才,后改名阿城,笔名、号有二十余个。浙江绍兴人。中国现代文学的奠基人之一,中国现代文学史上最重要的作家之一,中国共产党早期领导人之一,伟大的民族解放运动战士。</p>
</div>
<div class="exhibition-item">
<h3>纪念馆历史</h3>
<p>鲁迅纪念馆成立于1958年,是中国第一座以纪念鲁迅为主题的纪念馆。馆内陈列着鲁迅生前使用过的文房四宝、书籍、照片等珍贵文物,展示了鲁迅的生平事迹和文学成就。</p>
</div>
<div class="exhibition-item">
<h3>展览特色</h3>
<p>本次展览通过文献资料、实物展品、多媒体展示等形式,全面呈现鲁迅的思想世界、文学创作和革命活动,让观众更深入地了解这位伟大作家的精神世界。</p>
</div>
</div>
</div>
</section>
<!-- 生平时间线 -->
<section class="timeline" id="timeline">
<div class="container">
<h2>鲁迅生平时间线</h2>
<div class="timeline-container">
<div class="timeline-item">
<div class="timeline-content">
<div class="timeline-date">1881年9月25日</div>
<p>周树人(鲁迅)出生于浙江绍兴一个封建官僚家庭。</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-content">
<div class="timeline-date">1902年</div>
<p>赴日本留学,开始接触西方思想。</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-content">
<div class="timeline-date">1906年</div>
<p>发表第一篇白话小说《狂人日记》,开创中国现代文学新纪元。</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-content">
<div class="timeline-date">1918年</div>
<p>发表《呐喊》自序,揭示社会黑暗,引发轰动。</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-content">
<div class="timeline-date">1926年</div>
<p>发表《坟》,批判旧文化,倡导新文化。</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-content">
<div class="timeline-date">1936年10月19日</div>
<p>因病逝世,享年55岁。</p>
</div>
</div>
</div>
</div>
</section>
<!-- 代表作品 -->
<section class="works" id="works">
<div class="container">
<h2>代表作品</h2>
<div class="works-grid">
<div class="work-card">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=呐喊" alt="呐喊" class="work-img">
<h3>呐喊</h3>
<p>鲁迅的第一部短篇小说集,收录了《狂人日记》、《孔乙己》、《药》等著名作品。</p>
</div>
<div class="work-card">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=彷徨" alt="彷徨" class="work-img">
<h3>彷徨</h3>
<p>鲁迅的第二部短篇小说集,收录了《祝福》、《孤独者》、《伤逝》等作品。</p>
</div>
<div class="work-card">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=故事新编" alt="故事新编" class="work-img">
<h3>故事新编</h3>
<p>鲁迅的散文集,以古代神话故事为题材,讽刺现实社会。</p>
</div>
<div class="work-card">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=朝花夕拾" alt="朝花夕拾" class="work-img">
<h3>朝花夕拾</h3>
<p>鲁迅的回忆录,回顾童年往事,反映旧社会的种种弊端。</p>
</div>
</div>
</div>
</section>
<!-- 纪念照片墙 -->
<section class="photo-wall" id="photos">
<div class="container">
<h2>纪念照片墙</h2>
<div class="photos">
<div class="photo" data-src="https://via.placeholder.com/350x450/8b0000/ffffff?text=鲁迅照片1">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=照片1" alt="鲁迅照片1">
</div>
<div class="photo" data-src="https://via.placeholder.com/350x450/8b0000/ffffff?text=鲁迅照片2">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=照片2" alt="鲁迅照片2">
</div>
<div class="photo" data-src="https://via.placeholder.com/350x450/8b0000/ffffff?text=鲁迅照片3">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=照片3" alt="鲁迅照片3">
</div>
<div class="photo" data-src="https://via.placeholder.com/350x450/8b0000/ffffff?text=鲁迅照片4">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=照片4" alt="鲁迅照片4">
</div>
<div class="photo" data-src="https://via.placeholder.com/350x450/8b0000/ffffff?text=鲁迅照片5">
<img src="https://via.placeholder.com/350x250/8b0000/ffffff?text=照片5" alt="鲁迅照片5">
</div>
</div>
</div>
</section>
<!-- 参观信息 -->
<section class="visit-info" id="visit">
<div class="container">
<h2>参观信息</h2>
<div class="visit-details">
<div class="visit-card">
<h3>地址</h3>
<p>北京市海淀区颐和园路10号</p>
</div>
<div class="visit-card">
<h3>开放时间</h3>
<p>周一至周日 9:00-17:00(最后入馆时间16:30)</p>
</div>
<div class="visit-card">
<h3>联系电话</h3>
<p>010-88888888</p>
</div>
<div class="visit-card">
<h3>门票价格</h3>
<p>免费参观</p>
</div>
</div>
</div>
</section>
<!-- 页脚 -->
<footer class="footer-content">
<div class="container">
<div class="footer-section">
<h3>关于我们</h3>
<p>鲁迅纪念馆是中国第一座以纪念鲁迅为主题的纪念馆,致力于传承鲁迅精神,弘扬革命文化。</p>
</div>
<div class="footer-section">
<h3>联系我们</h3>
<p>地址:北京市海淀区颐和园路10号</p>
<p>电话:010-88888888</p>
<p>邮箱:ruxueminyuan@example.com</p>
</div>
<div class="footer-section">
<h3>友情链接</h3>
<p>中国共产党历史展览馆</p>
<p>中国革命博物馆</p>
<p>中国人民大学</p>
</div>
</div>
<div class="copyright">
<p>© 2023 鲁迅纪念馆 版权所有</p>
</div>
</footer>
<script>
// 简单的JavaScript交互功能
document.addEventListener('DOMContentLoaded', function() {
// 时间线项目点击效果
const timelineItems = document.querySelectorAll('.timeline-item');
timelineItems.forEach(item => {
item.addEventListener('click', function() {
this.classList.toggle('active');
});
});
// 照片墙点击效果
const photoWall = document.querySelector('.photo-wall');
const photos = document.querySelectorAll('.photo');
photos.forEach(photo => {
photo.addEventListener('click', function() {
alert('这是一张鲁迅的照片,点击查看更多相关信息。');
});
});
// 导航栏滚动效果
window.addEventListener('scroll', function() {
const nav = document.querySelector('nav');
if (window.scrollY > 100) {
nav.style.backgroundColor = '#5a0000';
nav.style.boxShadow = '0 5px 15px rgba(0, 0, 0, 0.3)';
} else {
nav.style.backgroundColor = '#8b0000';
nav.style.boxShadow = 'none';
}
});
});
</script>
</body>
</html>
关注公众号
低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
-
上一篇
LazyLLM x MemU:20 行代码打造有长记忆的知识问答助手
在开发知识问答助手的过程中,常见的挑战之一就是如何让智能体记住之前的对话和交互内容。 很多应用在实现多轮问答时,会遇到信息丢失或上下文混乱的问题:用户提过的问题、提供的数据、甚至助手之前的回答都无法被系统持续记忆,导致体验断层。对于企业级知识库或面向用户的个人助手来说,这种缺失不仅影响回答的准确性,也使得智能体难以形成长期价值。 构建一个能够记忆的问答系统,并非简单地将对话记录写入数据库。 智能体需要对历史信息进行结构化存储、动态检索,并在生成回答时合理利用这些信息。开发者在设计过程中常常要面对如何组织记忆、何时触发检索、如何在保证性能的同时处理大规模知识等问题。即便在开源框架和大模型辅助下,真正实现一个可落地、可维护的记忆系统仍然需要大量工程工作。 因此,我们将LazyLLM与MemU进行集成,提供了一个可直接落地的解决方案。LazyLLM 是一站式多 Agent 开发框架,能够高效管理智能体的任务和上下文。MemU 作为开源记忆管理系统,可提供灵活且高性能的记忆存储与检索能力; 通过这次集成,开发者可以在20 行左右的代码的基础上,快速搭建一个具备记忆能力的知识问答助手,让智能体能...
-
下一篇
Pingap-0.12.6:现代化、高性能的反向代理
✨ Pingap:现代化、高性能的反向代理 Pingap 是一款现代化、高性能的反向代理服务,它构建于 Cloudflare 开源的 Rust 语言 Pingora 框架之上。Pingap 的核心使命是提供一个 高性能基准 上的解决方案,提供web界面的配置管理,简单快捷。 🚀 一、 卓越的性能与运维效率 Pingap 通过现代化的架构设计,从根本上提升了服务性能和运维效率。 1. 零停机热更新与集群管理 核心配置热加载:对于 路由 (Location)、上游 (Upstream)、插件和证书 等核心配置,支持 10 秒内自动检测并热加载,实现真正的零停机变更。 集群配置中心:原生支持 Etcd 集群配置中心,实现了多实例 Pingap 间的配置实时同步和统一管理。 优雅升级:内置 --upgrade 模式,通过 Unix Socket 实现新旧进程间的连接平滑交接,保障服务在二进制版本更新时无中断。 2. 智能压缩与缓存性能 现代化压缩算法:内置支持 Gzip、Brotli (Br) 和 Zstd 等多种高效压缩算法,提供更高的压缩比。 革命性的压缩缓存:通过 Compressio...
相关文章
文章评论
共有0条评论来说两句吧...
文章二维码
点击排行
推荐阅读
最新文章
- SpringBoot2初体验,简单认识spring boot2并且搭建基础工程
- Linux系统CentOS6、CentOS7手动修改IP地址
- SpringBoot2编写第一个Controller,响应你的http请求并返回结果
- CentOS7,8上快速安装Gitea,搭建Git服务器
- SpringBoot2整合MyBatis,连接MySql数据库做增删改查操作
- CentOS6,CentOS7官方镜像安装Oracle11G
- CentOS8,CentOS7,CentOS6编译安装Redis5.0.7
- 2048小游戏-低调大师作品
- SpringBoot2整合Thymeleaf,官方推荐html解决方案
- 面试大杂烩












微信收款码
支付宝收款码