我在div中有几个按钮,一旦单击它们将显示一个值。我遇到的问题是:单击一个按钮并显示一个值后,它也会向下移动。我不确定如何防止这种情况的发生。有人可以帮忙吗?这是我创建的示例的链接:http : //codepen.io/anon/pen/eJzROE
<div id="gamebox">
<input type="button" id="one" onclick="clickBtn('one')"/>
<input type="button" id="two" onclick="clickBtn('two')"/>
<input type="button" id="three" onclick="clickBtn('three')"/>
<input type="button" id="four" onclick="clickBtn('four')"/>
<input type="button" id="five" onclick="clickBtn('five')"/>
<input type="button" id="six" onclick="clickBtn('six')"/>
<input type="button" id="seven" onclick="clickBtn('seven')"/>
<input type="button" id="eight" onclick="clickBtn('eight')"/>
<input type="button" id="nine" onclick="clickBtn('nine')"/>
</div>
#gamebox
{
height:460px;
width:460px;
border:2px solid red;
}
input
{
width:150px;
height:150px;
font-size:60px;
}
var player= 1;
function clickBtn(btn){
if(player == 1){
document.getElementById(btn).value = "X";
document.getElementById(btn).disabled = "disabled";
player -=1;
}
else {
document.getElementById(btn).value = "O";
document.getElementById(btn).disabled = "disabled";
player +=1;
}
}
对CSS输入定义进行一些细微调整将有助于将尺寸强制为特定高度。
input
{
background: white;
border: 1px solid #DDD;
height: 50px;
float: left;
display: block;
font-size: 14px;
width: 150px;
}
更新的示例:http : //codepen.io/anon/pen/qbNjXg
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句