前端拓展2

src/main/resources/static/index.html

@@ -126,7 +126,34 @@
             top: 4px;
             left: 4px;
         }
-        .大圆角标签 {
+        .大圆角标签1 {
+            width: 5px;
+            height: 30px;
+            background: #f62020;
+            border-radius: 1em;
+            float: left;
+            position: relative;
+            top: 0px;
+        }
+        .大圆角标签2 {
+            width: 5px;
+            height: 30px;
+            background: #f8c708;
+            border-radius: 1em;
+            float: left;
+            position: relative;
+            top: 0px;
+        }
+        .大圆角标签3 {
+            width: 5px;
+            height: 30px;
+            background: #3f4fd9;
+            border-radius: 1em;
+            float: left;
+            position: relative;
+            top: 0px;
+        }
+        .大圆角标签4 {
             width: 5px;
             height: 30px;
             background: #8ed495;
@@ -135,6 +162,15 @@
             position: relative;
             top: 0px;
         }
+        .大圆角标签5 {
+            width: 5px;
+            height: 30px;
+            background: #be8eb0;
+            border-radius: 1em;
+            float: left;
+            position: relative;
+            top: 0px;
+        }
 
     </style>
 </head>
@@ -158,13 +194,13 @@
         </table>
     </div>
     <div id="作品简介1">
-        <div class="大圆角标签"></div>
+        <div class="大圆角标签1"></div>
         <h2>&nbspQQ机器人是什么？</h2>
         <p>QQ机器人，是通过开放的接口，让开发者能够实现开发出交互形式丰富的机器人 以辅助实现频道/社群内的管理、消息互动，</a>满足群主运营者多样化、个性化的运营需求，从而提高运营效率，同时为用户带来丰富的服务和便捷的体验。</P>
 
     </div>
     <div id="作品简介2">
-        <div class="大圆角标签"></div>
+        <div class="大圆角标签2"></div>
         <h2>&nbspQ2：QQ机器人可以实现什么功能呢？</h2>
         <p>QQ机器人集便捷、高效、趣味、赋能于一身：</p>
 
@@ -174,20 +210,20 @@
 
     </div>
     <div id="作品简介3">
-        <div class="大圆角标签"></div>
+        <div class="大圆角标签3"></div>
         <h2>&nbspQ3：QQ机器人，区别于其他机器人的亮点有哪些？</h2>
         <p>QQ机器人目前还在不断地迭代升级，亮点满满，包括但不限于:内联能力。通过内联能力，在聊天窗口实现一键发送机器人内容，让你的机器人成为内容直接触达用户的有效通道；</P>
 
     </div>
     <div id="作品简介4">
-        <div class="大圆角标签"></div>
+        <div class="大圆角标签4"></div>
         <h2>&nbspQ4：QQ机器人能做什么？</h2>
         <p>社群管理-提效率：自动回复、自动分组、打卡等，提升管理效率</p>
         <p>用户互动-促活跃：成语接龙、猜灯谜、抽奖、RPG/SLG文字游戏等，提升频道活跃</P>
 
     </div>
     <div id="作品简介5">
-        <div class="大圆角标签"></div>
+        <div class="大圆角标签5"></div>
         <h2>&nbspQ5：QQ机器人的好处？</h2>
         <p>对于频道主、群主：帮助管理的工具，提升管理效率；同时提高群的活跃度</P>