刪除 HTML 按鈕中的空白

Question

所以我正在為我在 electron 中創建的客戶端編寫退出按鈕，在弄清楚如何根據屏幕尺寸調整它的大小后，按鈕旁邊顯示一個空白。 當我嘗試將它移動到正確的位置時，它也會在其下方創建一個巨大的白色框。 有誰知道為什么會這樣，可以幫我解決嗎？

<body>
    <webview src="https://bapbap.gg"></webview>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Archivo+Black">
    <style>
      body {
        display: flex;
        flex-direction: column;
        margin: 0;
        height: 100vh;
        position: relative;
      }
      
      webview {
        flex: 1;
      }
      
      .ExitButton {
        cursor: pointer;
        text-align: center;
        font-size: 10px;
        font-family: 'Archivo Black';
        color: #6B7075;
        border-color: transparent;
        background-color: transparent;
        transition-duration: 0.5s;
        transform: translate(700px, 300px);
      }
      
      .ExitButton:hover {
        background-color: rgb(150, 5, 5);
        transition-duration: 0.5s;
      }
      
      .nav {
        display: flex;
      }

    </style>
    <div class="nav">
      <button class="ExitButton" onclick="alert('Are you sure you want to exit BapClient?')">EXIT</button>
    </div>
    </button>
  </body>

Answer 1

在 class ExitButton中，行transform: translate(700px, 300px); 負責將按鈕從 [0,0] 移動到您提到的點：[700,300]。

通過刪除該行，您可以將按鈕放在頁面的左側和頂部。 然后你可以使用網格、布局等來改變位置到你想要的任何地方。

刪除 HTML 按鈕中的空白

問題描述

1 個解決方案

解決方案1
0 2022-10-08 06:56:16

刪除 HTML 按鈕中的空白

問題描述

1 個解決方案

解決方案1 0 2022-10-08 06:56:16

解決方案1
0 2022-10-08 06:56:16