简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Titre réécrit comme : Éliminer les espaces dans les boutons HTML
P粉787934476
P粉787934476 2023-09-15 13:01:31
0
1
647

J'écris donc un bouton de sortie pour un client basé sur les électrons et après avoir recherché comment le redimensionner en fonction de la taille de l'écran, un espace blanc apparaît à côté du bouton. Cela crée également une boîte blanche géante en dessous lorsque j'essaie de la déplacer dans la bonne position. Est-ce que quelqu'un sait pourquoi cela se produit et peut m'aider à y remédier ? 

<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

répondre à tous(1)
P粉550323338
P粉5503233382023-09-16 12:01:17 1 plancher

En classe ExitButton中，transform: translate(700px, 300px); cette ligne est chargée de déplacer le bouton de [0,0] au point que vous avez mentionné : [700,300].

En supprimant cette ligne de code, vous pouvez placer le bouton dans le coin supérieur gauche de la page. Vous pouvez ensuite modifier sa position où vous le souhaitez en utilisant la grille, la mise en page, etc.

Comme +0
Ajouter une réponse
Sujets populaires
Plus>
Articles populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！