开发第一阶段完毕

This commit is contained in:
2024-06-25 15:07:58 +08:00
parent 0ebbb20b28
commit 66a75c7a8b
17 changed files with 14748 additions and 77 deletions
+133 -77
View File
@@ -11,6 +11,7 @@
font-size: 14px;
color: #2c3e50;
}
.集数按钮 {
font-weight: 600;
color: #000;
@@ -23,18 +24,22 @@
cursor: pointer;
transition: 0.2s linear;
}
.集数按钮:hover {
opacity: 0.5;
}
.各集内容 {
padding: 14px;
display: none;
}
.各集内容 span{
.各集内容 span {
font-size: 24px;
font-weight: bolder;
color: #000;
}
.各集内容 .内容 {
border-radius: 15px;
border: 2px solid #000;
@@ -42,20 +47,24 @@
background-color: #FFF;
max-width: 580px;
}
.各集内容 img {
width: 100%;
height: auto;
}
.各集内容 p {
font-size: 16.8px;
line-height: 1.6;
}
.各集内容 .黑幕 {
background-color: #252525;
color: #252525;
transition: 0.13s linear;
font-size: 16.8px;
}
.各集内容 .黑幕:hover {
color: white;
}
@@ -63,6 +72,7 @@
#艺术字 {
margin-left: 105px;
}
#艺术字 .艺术字 {
width: 50%;
color: #36c0b9;
@@ -72,13 +82,16 @@
padding: 1em;
vertical-align: middle;
}
#艺术字 .艺术字 span {
font-size: 35px;
}
#bg{
#bg {
background: url(image/background_picture.jpg) no-repeat;
background-attachment: fixed;
}
#mybody {
padding: 1rem 2rem 2rem;
width: 880px;
@@ -88,10 +101,12 @@
font-size: 14px;
color: #2c3e50;
}
article {
display: block;
unicode-bidi: isolate;
}
#事先声明 {
color: rgb(70, 70, 70);
font-size: small;
@@ -99,10 +114,12 @@
border-left: 10px #1e90ff solid;
height: 50px;
}
div {
display: block;
unicode-bidi: isolate;
}
h2 {
display: block;
font-size: 1.5em;
@@ -113,6 +130,7 @@
font-weight: bold;
unicode-bidi: isolate;
}
p {
display: block;
margin-block-start: 1em;
@@ -121,16 +139,20 @@
margin-inline-end: 0px;
unicode-bidi: isolate;
}
a {
text-decoration: none;
color: #3f51b5;
}
a:active,a:visited:active {
a:active, a:visited:active {
color: orange;
}
a:visited {
color: #0b0080;
}
#事先声明 {
color: rgb(70, 70, 70);
font-size: small;
@@ -138,16 +160,19 @@
border-left: 10px #1e90ff solid;
height: 50px;
}
#事先声明 p {
position: relative;
top: -50px;
left: 70px;
}
#事先声明 img {
position: relative;
top: 4px;
left: 4px;
}
.大圆角标签1 {
width: 5px;
height: 30px;
@@ -157,6 +182,7 @@
position: relative;
top: 0px;
}
.大圆角标签2 {
width: 5px;
height: 30px;
@@ -166,6 +192,7 @@
position: relative;
top: 0px;
}
.大圆角标签3 {
width: 5px;
height: 30px;
@@ -175,6 +202,7 @@
position: relative;
top: 0px;
}
.大圆角标签4 {
width: 5px;
height: 30px;
@@ -184,6 +212,7 @@
position: relative;
top: 0px;
}
.大圆角标签5 {
width: 5px;
height: 30px;
@@ -194,6 +223,16 @@
top: 0px;
}
.大圆角标签6 {
width: 5px;
height: 30px;
background: #44c7e8;
border-radius: 1em;
float: left;
position: relative;
top: 0px;
}
.imgBox {
display: inline-block;
width: 113px;
@@ -201,9 +240,11 @@
text-align: center;
transition: 0.25s;
}
.imgBox:hover {
opacity: 0.70;
}
.imgBox img {
width: 100px;
height: 100px;
@@ -232,7 +273,9 @@
<div id="作品简介1">
<div class="大圆角标签1"></div>
<h2>&nbspQQ机器人是什么?</h2>
<p>QQ机器人,是通过开放的接口,让开发者能够实现开发出交互形式丰富的机器人 以辅助实现频道/社群内的管理、消息互动,</a>满足群主运营者多样化、个性化的运营需求,从而提高运营效率,同时为用户带来丰富的服务和便捷的体验。</P>
<p>QQ机器人,是通过开放的接口,让开发者能够实现开发出交互形式丰富的机器人
以辅助实现频道/社群内的管理、消息互动,</a>
满足群主运营者多样化、个性化的运营需求,从而提高运营效率,同时为用户带来丰富的服务和便捷的体验。</P>
</div>
<div id="作品简介2">
@@ -240,15 +283,16 @@
<h2>&nbspQ2:QQ机器人可以实现什么功能呢?</h2>
<p>QQ机器人集便捷、高效、趣味、赋能于一身:</p>
<p> 高效的社群管理功能(如:身份组分配、自动回复、签到打卡等)</p>
<p> 稳健的音频功能(如:听歌、听书、语音开黑、在线玩桌游等)</p>
<p> 有趣的游戏功能(如:猜灯谜、成语接龙、打年兽升级、攻城守家等)</P>
<p> 高效的社群管理功能(如:身份组分配、自动回复、签到打卡等)</p>
<p> 稳健的音频功能(如:听歌、听书、语音开黑、在线玩桌游等)</p>
<p> 有趣的游戏功能(如:猜灯谜、成语接龙、打年兽升级、攻城守家等)</P>
</div>
<div id="作品简介3">
<div class="大圆角标签3"></div>
<h2>&nbspQ3:mirai框架的QQ机器人,区别于其他QQ机器人的亮点有哪些?</h2>
<p>mirai框架发展时间长,技术更成熟,现有的更好的QQ机器人框架都是在mirai基础上进行迭代升级的,所以对QQ机器人的框架学习更有帮助</P>
<p>
mirai框架发展时间长,技术更成熟,现有的更好的QQ机器人框架都是在mirai基础上进行迭代升级的,所以对QQ机器人的框架学习更有帮助</P>
</div>
<div id="作品简介4">
@@ -265,105 +309,117 @@
</div>
<h1>项目效果演示:</h1>
<h1>项目效果演示:</h1>
<div class="集数按钮">#01</div>
<div class="集数按钮">#02</div>
<div class="集数按钮">#03</div>
<div class="集数按钮">#04</div>
<div class="集数按钮">#05</div>
<div class="集数按钮">#06</div>
<div class="集数按钮">#07</div>
<div class="集数按钮">#08</div>
<div class="集数按钮">#01</div>
<div class="集数按钮">#02</div>
<div class="集数按钮">#03</div>
<div class="集数按钮">#04</div>
<div class="集数按钮">#05</div>
<div class="集数按钮">#06</div>
<div class="集数按钮">#07</div>
<div class="集数按钮">#08</div>
<div class="各集内容">
<span>#01 骚扰机器人</span>
<div class="内容">
<img src="image/骚扰机器人.png">
<div class="各集内容">
<span>#01 骚扰机器人</span>
<div class="内容">
<img src="image/骚扰机器人.png">
<p>在群中发送“111”字样即可让bot“稍微的”理你一下</p>
<p>在群中发送“111”字样即可让bot“稍微的”理你一下</p>
</div>
</div>
</div>
<div class="各集内容">
<span>#02 群聊主动回复</span>
<div class="内容">
<img src="image/群聊回复1.png">
<img src="image/群聊回复2.png">
<div class="各集内容">
<span>#02 群聊主动回复</span>
<div class="内容">
<img src="image/群聊回复1.png">
<img src="image/群聊回复2.png">
<p>在群聊中消息带上“呼叫管理”,管理员便可以在控制台进行回复</p>
<p>在群聊中消息带上“呼叫管理”,管理员便可以在控制台进行回复</p>
</div>
</div>
</div>
<div class="各集内容">
<span>#03 临时会话回复</span>
<div class="内容">
<img src="image/临时会话1.png">
<img src="image/临时会话2.png">
<div class="各集内容">
<span>#03 临时会话回复</span>
<div class="内容">
<img src="image/临时会话1.png">
<img src="image/临时会话2.png">
<p>在群聊中对bot进行临时会话,管理员便可在控制台进行回复</p>
<p>在群聊中对bot进行临时会话,管理员便可在控制台进行回复</p>
</div>
</div>
</div>
<div class="各集内容">
<span>#04 好友消息回复</span>
<div class="内容">
<img src="image/好友发送消息.jpg">
<img src="image/好友发送消息2.png">
<div class="各集内容">
<span>#04 好友消息回复</span>
<div class="内容">
<img src="image/好友发送消息.jpg">
<img src="image/好友发送消息2.png">
<p>bot的好友发起聊天后,管理员便可以在控制台进行回复</p>
<p>bot的好友发起聊天后,管理员便可以在控制台进行回复</p>
</div>
</div>
</div>
<div class="各集内容">
<span>#05 接收消息</span>
<div class="内容">
<img src="image/接收1.jpg">
<img src="image/接收2.jpg">
<img src="image/接收3.jpg">
<img src="image/接收4.png">
<div class="各集内容">
<span>#05 接收消息</span>
<div class="内容">
<img src="image/接收1.jpg">
<img src="image/接收2.jpg">
<img src="image/接收3.jpg">
<img src="image/接收4.png">
<p>在群聊中或者与机器人进行私聊,控制台便可以接收到信息</p>
<p>在群聊中或者与机器人进行私聊,控制台便可以接收到信息</p>
</div>
</div>
</div>
<div class="各集内容">
<span>#06 钓鱼游戏</span>
<div class="内容">
<img src="image/钓鱼.png">
<div class="各集内容">
<span>#06 钓鱼游戏</span>
<div class="内容">
<img src="image/钓鱼.png">
<p>在群聊中发送“钓鱼”字样,即可进行“有趣的”钓鱼游戏</p>
<p>“钓鱼虽好,可不要贪杆哦”</p>
<p>在群聊中发送“钓鱼”字样,即可进行“有趣的”钓鱼游戏</p>
<p>“钓鱼虽好,可不要贪杆哦”</p>
</div>
</div>
</div>
<div class="各集内容">
<span>#07 禁言套餐</span>
<div class="内容">
<img src="image/原神1.png">
<img src="image/原神2.png">
<p>在群中发送消息带有“<span class="黑幕" title="你知道的太多了">原神</span>启动”“<span class="黑幕" title="你知道的太多了">OP</span>”等违禁词即可喜提“60S”禁言+撤回大礼包</p>‘
<p>偷偷告诉你,分开输入的话笨蛋bot是检测不出来的</p>
<div class="各集内容">
<span>#07 禁言套餐</span>
<div class="内容">
<img src="image/原神1.png">
<img src="image/原神2.png">
<p>在群中发送消息带有“<span class="黑幕" title="你知道的太多了">原神</span>启动”“<span class="黑幕"
title="你知道的太多了">OP</span>”等违禁词即可喜提“60S”禁言+撤回大礼包
</p>‘
<p>偷偷告诉你,分开输入的话笨蛋bot是检测不出来的</p>
</div>
</div>
</div>
<div class="各集内容">
<span>#08 文字冒险(待实现)</span>
<div class="内容">
<img src="image/文字游戏.png">
<div class="各集内容">
<span>#08 文字冒险(待实现)</span>
<div class="内容">
<img src="image/文字游戏.png">
<p>在群聊中发送”txtgame“即可进行紧张刺激的文字冒险游戏</p>
<p></p>
<p>在群聊中发送”txtgame“即可进行紧张刺激的文字冒险游戏</p>
<p></p>
</div>
</div>
</div>
<p>此外还可以在下表中查看群聊消息统计数据</p>
<div class="imgBox">
<a href="messagelist" title="后藤一里"><img src="image/200px-后藤独头贴.png">点我查看bot统计信息</a>
</div>
<br>
<br>
<br>
<div class="作品简介">
<div class="大圆角标签6"></div>
<h2>&nbsp后记:</h2>
<p>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp我们项目组由衷的感谢Mirai框架与将Mirai框架集成到SpringBoot中的各位前辈,正是他们的开源精神推动了整个社区的良性发展,</p>
<p>得以让我们能够站在巨人的肩膀头上实现我们自己的想法</p>
<p>&nbsp</p>
<p>Mirai项目地址:<a href="https://github.com/mamoe/mirai">https://github.com/mamoe/mirai</a></p>
<p>基于Mirai核心封装的SpringBoot Starter:<a href="https://github.com/itbaima-study/itbaima-robot-starter">https://github.com/itbaima-study/itbaima-robot-starter</a></p>
</div>
</article>
<script>
var contents = document.getElementsByClassName("各集内容");
contents[0].style.display = "block";