docs: 添加了更健壮的注释

style.css

@@ -1,19 +1,23 @@
+/* 全局样式重置 */
 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }
 
+/* 页面基础样式 */
 body {
     font-family: Arial, sans-serif;
 }
 
+/* 主容器样式 */
 .container {
     max-width: 800px;
     margin: 0 auto;
     padding: 20px;
 }
 
+/* 页面头部样式 */
 header {
     text-align: center;
     margin-bottom: 30px;
@@ -21,21 +25,25 @@ header {
     border-bottom: 1px solid #000;
 }
 
+/* 页面标题样式 */
 header h1 {
     font-size: 24px;
 }
 
+/* 通用区块样式 */
 .section {
     margin-bottom: 30px;
     padding: 20px;
     border: 1px solid #000;
 }
 
+/* 区块标题样式 */
 .section h2 {
     font-size: 18px;
     margin-bottom: 15px;
 }
 
+/* 输入框通用样式 */
 input {
     display: block;
     width: 100%;
@@ -45,6 +53,7 @@ input {
     font-size: 14px;
 }
 
+/* 按钮通用样式 */
 button {
     border: 1px solid #000;
     padding: 10px 20px;
@@ -54,19 +63,23 @@ button {
     transition: background-color 0.2s;
 }
 
+/* 按钮悬停效果 */
 button:hover {
     background-color: #f0f0f0;
 }
 
+/* 按钮点击效果 */
 button:active {
     background-color: #e0e0e0;
 }
 
+/* 段落通用样式 */
 p {
     margin-top: 10px;
     font-size: 14px;
 }
 
+/* 文档项样式 */
 .doc-item{
     display: flex;
     justify-content: space-between;
@@ -75,11 +88,14 @@ p {
     margin-bottom: 5px;
     border: 1px solid #000;
 }
+
+/* 文档项内段落样式 */
 .doc-item p{
     margin-top: 0;
     font-size: 16px;
 }
 
+/* App项样式 */
 .app-item {
     display: flex;
     justify-content: space-between;
@@ -89,56 +105,67 @@ p {
     border: 1px solid #000;
 }
 
+/* App信息区域样式 */
 .app-info {
     flex: 1;
 }
 
+/* App名称样式 */
 .app-info h3 {
     font-size: 16px;
     margin-bottom: 5px;
 }
 
+/* App日期样式 */
 .app-info p {
     font-size: 12px;
     margin: 0;
 }
 
+/* 下载按钮样式 */
 .download-btn {
     padding: 8px 15px;
     font-size: 12px;
 }
 
+/* 退出按钮样式 */
 .logout-btn {
     margin-top: 10px;
     font-size: 12px;
 }
 
+/* 加载指示器样式 */
 #loadingIndicator {
     font-size: 12px;
     color: #666;
 }
 
-/* 响应式设计 */
+/* 响应式设计 - 移动端适配 */
 @media (max-width: 600px) {
+    /* 移动端主容器样式 */
     .container {
         margin: 10px;
         padding: 15px;
     }
     
+    /* 移动端区块样式 */
     .section {
         padding: 15px;
     }
     
+    /* 移动端App项样式，改为垂直排列 */
     .app-item {
         flex-direction: column;
         align-items: flex-start;
     }
     
+    /* 移动端文档项样式，改为垂直排列 */
     .doc-item {
         flex-direction: column;
         align-items: flex-start;
     }
     
+    /* 移动端下载按钮样式，添加顶部间距 */
     .download-btn {
         margin-top: 10px;
     }