diff --git a/src/components/prompt/prompt-styles.ts b/src/components/prompt/prompt-styles.ts
index 2a4ffb1..0660383 100644
--- a/src/components/prompt/prompt-styles.ts
+++ b/src/components/prompt/prompt-styles.ts
@@ -4,10 +4,6 @@ export const sharedStyles: CSSResult = css`
     --deep--color: linear-gradient(101.98deg, #4e5161 1.12%, #363a47 96.75%);
   }
 
-  button {
-    margin: 30px;
-  }
-
   .cover {
     position: fixed;
     left: 0;
@@ -27,11 +23,8 @@ export const sharedStyles: CSSResult = css`
     -webkit-border-radius: 0.5em;
     -moz-border-radius: 0.5em;
     border-radius: 0.5em;
-    box-shadow: 2px 3px 0 rgba(190, 190, 190, 0.3);
-    -webkit-box-shadow: 2px 3px 0 rgba(190, 190, 190, 0.3);
-    -moz-box-shadow: 2px 3px 0 rgba(190, 190, 190, 0.3);
     text-align: center;
-    padding: 20px;
+    padding: 3%;
     background: linear-gradient(
       134.78deg,
       #f7f5f7 2.34%,
@@ -55,19 +48,20 @@ export const sharedStyles: CSSResult = css`
 
   .title {
     text-align: left;
-    margin-left: 10px;
+    margin-left: 1%;
   }
 
   .container {
     position: relative;
-    background-color: #ffffff;
+    background-color: transparent;
+    margin-top: 10%;
   }
 
   .input {
     width: inherit;
     height: 30px;
     background-color: #ffffff;
-    box-shadow:0 0 0px 1000px white inset;
+    box-shadow: 0 0 0px 1000px white inset;
     border: 2px solid #e6e8f5;
     border-radius: 6px;
     padding-left: 4%;
@@ -75,10 +69,10 @@ export const sharedStyles: CSSResult = css`
     padding-top: 1.5%;
     font-family: OPPOSans;
     font-weight: bold;
-    font-size: 11px;
-    color: #333333;
+    font-size: 12px;
+    color: rgba(38, 38, 38, 0.45);
     outline: none;
-    letter-spacing: 2.5px;
+    letter-spacing: 2px;
   }
 
   .input:focus {
@@ -92,14 +86,14 @@ export const sharedStyles: CSSResult = css`
   .eye {
     position: absolute;
     top: 35%;
-    right: 0;
+    right: 5%;
     background-color: transparent;
   }
 
   .show::before {
     content: '';
     position: absolute;
-    left: 75%;
+    left: 80%;
     right: 0%;
     top: 30%;
     bottom: 30%;
@@ -115,6 +109,18 @@ export const sharedStyles: CSSResult = css`
     }
   }
 
+  .location {
+    text-align: right;
+    margin-top: 3.5%;
+  }
+
+  .info {
+    text-align: right;
+    color: #292929;
+    font-size: 13px;
+    opacity: 0.7;
+  }
+
   .cancel {
     font-family: Microsoft YaHei, Verdana, Arial, Helvetica, sans-serif;
     font-style: normal;
@@ -149,10 +155,36 @@ export const sharedStyles: CSSResult = css`
     display: none;
   }
 
-  .info {
-    color: #292929;
-    opacity: 0.7;
-    font-size: 13px;
+  .group {
+    margin-top: 20%;
+  }
+
+  .wifi {
+    line-height: 18.2px;
+    cursor: pointer;
+    background: rgba(51, 51, 51, 0.06);
+    color: #4d4d4d;
+    text-align: center;
+    font-weight: 500;
+    font-size: 14px;
+    padding: 10px 45px 14px;
+    margin-right: 0%;
+    border: none;
+    border-radius: 18px;
+  }
+
+  .blue {
+    line-height: 18.2px;
+    cursor: pointer;
+    background: #1d98f0;
+    color: #f0f0f0;
+    text-align: center;
+    font-weight: 500;
+    font-size: 14px;
+    padding: 10px 45px 14px;
+    margin-right: 0%;
+    border: none;
+    border-radius: 18px;
   }
 
   /*深色模式*/
@@ -162,10 +194,10 @@ export const sharedStyles: CSSResult = css`
   }
   :host([deep]) .input {
     background: rgba(98, 93, 103, 0.4);
-    box-shadow:0 0 0px 1000px rgba(98, 93, 103, 0.4) inset;
+    box-shadow: 0 0 0px 1000px rgba(98, 93, 103, 0.4) inset;
     border: 2px solid #2e3038;
     border-radius: 4px;
-    color: #ffffff;
+    color: rgba(240, 240, 240, 0.45);
   }
   :host([deep]) .input:focus {
     border: 2px solid #1d98f0;
@@ -187,5 +219,60 @@ export const sharedStyles: CSSResult = css`
   }
   :host([deep]) .info {
     color: #e0e0e0;
+    opacity: 0.7;
+  }
+  :host([deep]) .wifi {
+    background: rgba(228, 228, 228, 0.1);
+    color: #e0e0e0;
+  }
+
+  /*WIFI弹窗*/
+  :host([wifi]) .popBox {
+    width: 512px;
+    height: 700px;
+  }
+  :host([wifi]) .title {
+    width: 150px;
+    height: 26px;
+    font-weight: 400;
+    font-size: 26px;
+    line-height: 26px;
+    letter-spacing: 1px;
+  }
+  :host([wifi]) .input {
+    width: 486px;
+    height: 60.5px;
+    font-size: 26px;
+    line-height: 26px;
+    letter-spacing: 1px;
+  }
+  :host([wifi]) .info {
+    font-weight: 400;
+    font-size: 24px;
+    line-height: 26px;
+    letter-spacing: 1px;
+  }
+  :host([wifi]) .sure {
+    width: 200px;
+    height: 64px;
+    left: 272px;
+    top: 596px;
+    border-radius: 34px;
+    font-size: 26px;
+    font-weight: 400;
+    line-height: 26px;
+  }
+  :host([wifi]) .cancel {
+    width: 200px;
+    height: 64px;
+    left: 48px;
+    top: 596px;
+    border-radius: 34px;
+    font-size: 26px;
+    font-weight: 400;
+    line-height: 26px;
+  }
+  :host([wifi]) .group {
+    margin-top: 75%;
   }
 `
diff --git a/src/components/prompt/prompt.ts b/src/components/prompt/prompt.ts
index c8e7f46..7edfeab 100644
--- a/src/components/prompt/prompt.ts
+++ b/src/components/prompt/prompt.ts
@@ -2,7 +2,6 @@ import {html, LitElement, CSSResultArray} from 'lit'
 import {customElement, property, queryAssignedElements} from 'lit/decorators.js'
 import {sharedStyles} from './prompt-styles'
 import '../button/button'
-
 @customElement('star-prompt')
 export class StarPrompt extends LitElement {
   public static override get styles(): CSSResultArray {
@@ -25,6 +24,14 @@ export class StarPrompt extends LitElement {
 
   @property({type: String}) text = ''
 
+  @property({type: Boolean}) wifi = false
+
+  @property({type: String}) bone = '取消'
+
+  @property({type: String}) btwo = '确定'
+
+  @property({ type: String }) placeholder = '密码';
+
   _getElement() {
     if (this.open == true) {
       this._evenEl[0].style.display = 'block'
@@ -62,83 +69,60 @@ export class StarPrompt extends LitElement {
         <div class="cover"></div>
         <div class="popBox">
           <h3 class="title">${this.label}</h3>
-          <form action="" method="post">
-            <table width="100%" cellspacing="5">
-              <tr>
-                <td align="left">
-                  <div class="container">
-                    ${
-                      this.password == false
-                        ? html`
-                            <input
-                              type="text"
-                              name="hasReason"
-                              value="密码"
-                              class="input"
+          <div class="container">
+            ${this.password == false
+              ? html`
+                  <input
+                    type="text"
+                    name="hasReason"
+                    value="${this.placeholder}"
+                    class="input"
+                  />
+                `
+              : html`
+                  <input type="password" name="hasReason" class="input" />
+                  <div @click=${this._showpassword} class="show">
+                    ${this.visible == true
+                      ? html`
+                          <img src="src/assets/eye.svg" class="eye" />
+                          <div class="drop">
+                            <img src="src/assets/eye_deep.svg" class="eye" />
+                          </div>
+                        `
+                      : html`
+                          <img src="src/assets/close_eye.svg" class="eye" />
+                          <div class="drop">
+                            <img
+                              src="src/assets/close_eye_deep.svg"
+                              class="eye"
                             />
-                          `
-                        : html`
-                            <input
-                              type="password"
-                              name="hasReason"
-                              class="input"
-                            />
-                            <div @click=${this._showpassword} class="show">
-                              ${this.visible == true
-                                ? html`
-                                    <img src="src/assets/eye.svg" class="eye" />
-                                    <div class="drop">
-                                      <img
-                                        src="src/assets/eye_deep.svg"
-                                        class="eye"
-                                      />
-                                    </div>
-                                  `
-                                : html`
-                                    <img
-                                      src="src/assets/close_eye.svg"
-                                      class="eye"
-                                    />
-                                    <div class="drop">
-                                      <img
-                                        src="src/assets/close_eye_deep.svg"
-                                        class="eye"
-                                      />
-                                    </div>
-                                  `}
-                            </div>
-                          `
-                    }
+                          </div>
+                        `}
                   </div>
-                </td>
-                <tr>
-                <td align="right">
-                  <span class="info">${this.text}</span>
-                </td>
-                </tr>
-              </tr>
-              <tr>
-                <td colspan="2" align="center">
-                  <br />
-                  <input
-                    id="ok"
-                    type="button"
-                    class="cancel"
-                    value="取消"
-                    @click="${this._getElement}"
-                  />
-                  <input type="button" class="vertical" value="|" />
-                  <input
-                    id="cancel"
-                    type="button"
-                    class="sure"
-                    value="确定"
-                    @click="${this._getElement}"
-                  />
-                </td>
-              </tr>
-            </table>
-          </form>
+                `}
+          </div>
+          <div class="location">
+            <span class="info">${this.text}</span>
+          </div>
+          <div class="group">
+            ${this.wifi == false
+              ? html`
+                  <button class="cancel" @click="${this._getElement}">
+                    取消
+                  </button>
+                  <button class="sure" @click="${this._getElement}">
+                    确定
+                  </button>
+                `
+              : html`
+                  <button class="cancel wifi" @click="${this._getElement}">
+                    ${this.bone}
+                  </button>
+                  <button class="sure blue" @click="${this._getElement}">
+                    ${this.btwo}
+                  </button>
+                `}
+          </div>
         </div>
       </slot>
     `