Sfoglia il codice sorgente

背景图自适应

李富豪 1 anno fa
parent
commit
9306491fb4
2 ha cambiato i file con 14 aggiunte e 2 eliminazioni
  1. 13 2
      app/components/chat.module.scss
  2. 1 0
      app/styles/globals.scss

+ 13 - 2
app/components/chat.module.scss

@@ -282,6 +282,16 @@
   height: 100%;
 }
 
+.chat-body::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.3);
+}
+
 .chat-body {
   flex: 1;
   overflow: auto;
@@ -291,8 +301,9 @@
   position: relative;
   overscroll-behavior: none;
   background-image: url("../../public/bg_w.png");
-  background-size: cover;
-  background-position: left;
+  background-size: cover; /* 使背景图片按比例填充容器 */
+  background-position: center; /* 居中显示背景图片 */
+  background-repeat: no-repeat; /* 避免重复 */
 }
 
 .chat-body-main-title {

+ 1 - 0
app/styles/globals.scss

@@ -355,6 +355,7 @@ pre {
   border: var(--border-in-light);
   box-shadow: var(--card-shadow);
   border-radius: 11px;
+  background: #FFFFFF;
 }
 
 .one-line {