gpt4 book ai didi

html - CSS:无法垂直移动我的按钮

转载 作者:行者123 更新时间:2023-11-28 08:56:46 25 4
gpt4 key购买 nike

我得到了以下简单的 HTML 代码:

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="estilos.css">
</head>
<body>
<div id="bar">
<span>
Palavra
</span>
<form>
<input class="buttom" type="submit" value="">
</form>
</div>

</body>
</html>

我的 CSS 代码是这样的:

#bar{
width:100%;
height:7%;
background-color:#5959AB;
color:white;
font-family:"Arial";
font-size:150%;
font-weight: bold;
line-height: 190%;
}

.buttom{
background: url(icone_dicionario.jpg) no-repeat;
cursor: pointer;
width: 40px;
height: 41px;
}

input{
position:relative;
bottom:1000%;
left:13%;
}



html, body{
height:100%;
}

看看 CSS 上的 input 样式。它代表的元素(字典图标中的一个按钮)服从我给它的水平位置(“left: 13%”),但不是垂直位置(不管我输入的值如何它),如您所见:

谁能帮帮我?

PS:我希望按钮出现在栏内,除了那个词......

最佳答案

JSFiddle

只需将属性 top: -40px; 添加到 input 样式。因为输入的宽度是固定的。

input{
position:relative;
bottom:1000%;
left:13%;
top:-40px;
}

关于html - CSS:无法垂直移动我的按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27095211/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com