标题重写为:消除HTML按钮中的空格
P粉787934476
P粉787934476 2023-09-15 13:01:31
0
1
641

所以我正在为一个基于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>
P粉787934476
P粉787934476

全部回复(1)
P粉550323338

在类ExitButton中,transform: translate(700px, 300px);这一行负责将按钮从[0,0]移动到您提到的点:[700,300]。

通过删除这行代码,您可以将按钮放置在页面的左上角。然后,您可以使用网格、布局等方法将其位置更改为任何您想要的位置。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!