[英]Removing white space in HTML button
所以我正在为我在 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>
在 class ExitButton
中,行transform: translate(700px, 300px);
负责将按钮从 [0,0] 移动到您提到的点:[700,300]。
通过删除该行,您可以将按钮放在页面的左侧和顶部。 然后你可以使用网格、布局等来改变位置到你想要的任何地方。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.