From 9f165746123106aabd5e679ff02e623510765e4d Mon Sep 17 00:00:00 2001 From: shuaikangzhou <863909694@qq.com> Date: Fri, 29 Dec 2023 22:41:49 +0800 Subject: [PATCH] =?UTF-8?q?html=E9=80=82=E9=85=8D=E7=A7=BB=E5=8A=A8?= =?UTF-8?q?=E7=AB=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/resources/data/template.html | 126 +++++++++++++++++++++---------- 1 file changed, 88 insertions(+), 38 deletions(-) diff --git a/app/resources/data/template.html b/app/resources/data/template.html index 5f37bb8..2ff4368 100644 --- a/app/resources/data/template.html +++ b/app/resources/data/template.html @@ -10,13 +10,13 @@ margin: 0; } body{ - height: 100vh; - width: 100%; display: flex; + flex-direction: row; + height: 100vh; + margin: 0; align-items: center; justify-content: center; } - .modal { display: none; position: fixed; @@ -38,14 +38,16 @@ body{ transform: translate(-50%, -50%); } .container{ - height: 99%; - width: 900px; + height: 80vh; + width: 100%; + max-width: 900px; border-radius: 4px; border: 0.5px solid #e0e0e0; background-color: #f5f5f5; display: flex; - flex-flow: column; + /* flex-flow: column; */ overflow: hidden; + justify-content: center; /* 在主轴上居中 */ } .content{ width: calc(100% - 40px); @@ -262,8 +264,9 @@ textarea{ display: flex; flex-direction: column; align-items: center; - margin-top: 20px; + margin-top: 0px; margin-left: 20px; /* 新增的左边距 */ + justify-content: center; /* 在主轴上居中 */ } .button-row, @@ -307,55 +310,102 @@ input { color: #555; font-size: 14px; } +@media screen and (max-width: 768px) { + body{ + display: flex; /* 使用 Flex 布局 */ + flex-direction: column; /* 设置主轴方向为垂直方向 */ + align-items: center; /* 在交叉轴上居中 */ + } + /* 在屏幕宽度小于等于 768px 时应用的样式 */ + .pagination-container { + display: flex; /* 使用 Flex 布局 */ + justify-content: center; /* 在主轴上居中 */ + flex-direction: row; + } + .button-row, + .jump-row, + #paginationInfo { + display: flex; + justify-content: center; + align-items: center; + margin-bottom: 0px; + } + button { + padding: 5px 10px; + background-color: #3498db; + color: white; + border: none; + border-radius: 4px; + cursor: pointer; + margin: 0 5px; + transition: background-color 0.3s; + } + + button:hover { + background-color: #2980b9; + } + + input { + padding: 8px; + width: 120px; + box-sizing: border-box; + margin-right: 0px; + margin-left: 5px; + } +} .emoji_img { width: 22px; height: 22px; vertical-align: middle; margin-top: -4.4px; } - -
-
-
昨天 12:35
-
你已添加了凡繁烦，现在可以开始聊天了。
-
-
- +
+
+
+ +
-
您好,我在武汉，你可以直接送过来吗，我有时间的话，可以自己过去拿
！！！
123 +
+ +
+
+
+
+ +
+
+
昨天 12:35
+
你已添加了凡繁烦，现在可以开始聊天了。
+
+
+ +
+
您好,我在武汉，你可以直接送过来吗，我有时间的话，可以自己过去拿
！！！
123 +
+
-
-
hello
你好呀
-
- +
+
hello
你好呀
+
+ +
+
+
+ 昨天 13:15
-
- 昨天 13:15 -
-
-
- -
-
- - +
+ -
- - -
-
-
+