first commit

2025-01-14 19:49:51 +08:00
commit 2cd80133b3
85 changed files with 36565 additions and 0 deletions
--- a/html/demo.html
+++ b/html/demo.html
@@ -0,0 +1,89 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Tab View</title>
+    <style>
+       .tab {
+            overflow: hidden;
+            border: 1px solid #ccc;
+            background-color: #f1f1f1;
+        }
+       .tab button {
+            background-color: inherit;
+            float: left;
+            border: none;
+            outline: none;
+            cursor: pointer;
+            padding: 14px 16px;
+            transition: 0.3s;
+            font-size: 17px;
+        }
+       .tab button:hover {
+            background-color: #7187f3;
+        }
+       .tab button.active {
+            background-color: #186af0;
+        }
+       .tabcontent {
+            display: none;
+            padding: 6px 12px;
+            border: 1px solid #ccc;
+            border-top: none;
+        }
+    </style>
+</head>
+<body>
+
+<div class="tab">
+    <button class="tablinks" onclick="openTab(event, 'Tab1')">常规</button>
+    <button class="tablinks" onclick="openTab(event, 'Tab2')">蓝牙</button>
+    <button class="tablinks" onclick="openTab(event, 'Tab3')">胎压</button>
+    <button class="tablinks" onclick="openTab(event, 'Tab4')">配置</button>
+</div>
+
+<div id="Tab1" class="tabcontent">
+    <h3>Tab 1 Content</h3>
+    <p>This is the content of Tab 1.</p>
+</div>
+
+<div id="Tab2" class="tabcontent">
+    <h3>Tab 2 Content</h3>
+    <p>This is the content of Tab 2.</p>
+</div>
+
+<div id="Tab3" class="tabcontent">
+    <h3>Tab 3 Content</h3>
+    <p>This is the content of Tab 3.</p>
+</div>
+
+<div id="Tab4" class="tabcontent">
+    <h3>Tab 4 Content</h3>
+    <p>This is the content of Tab 4.</p>
+</div>
+
+<script>
+    function initPage(){
+        openTab(event, 'Tab1');
+    }
+
+    function openTab(evt, tabName) {
+        var i, tabcontent, tablinks;
+        tabcontent = document.getElementsByClassName("tabcontent");
+        for (i = 0; i < tabcontent.length; i++) {
+            tabcontent[i].style.display = "none";
+        }
+        tablinks = document.getElementsByClassName("tablinks");
+        for (i = 0; i < tablinks.length; i++) {
+            tablinks[i].className = tablinks[i].className.replace("active", "");
+        }
+        document.getElementById(tabName).style.display = "block";
+        evt.currentTarget.className += " active";
+    }
+
+    window.onload = initPage;
+</script>
+
+</body>
+</html>