这里是CSS：

div.hscroll { 
    width: 550px; 
    height: 1000px; 
    overflow: scroll;
    top:35%;
    left:10%;
    margin-left: auto;
    margin-right: auto;
}

.leftbutton{
    position:fixed;
    width:30px;
    top:35%;
    left:27%;
}

.rightbutton{
    position:fixed;
    width:20px;
    height:50px;
    top:35%;
    right:27%;
}

这里是HTML代码：

<script type="text/javascript">   
var timer1;
function scrollDiv(divId, depl) {
   var scroll_container = document.getElementById(divId);
   scroll_container.scrollLeft -= depl;
   timer1 = setTimeout('scrollDiv("'+divId+'", '+depl+')', 10);
}
</script>

<div class="leftbutton";>
    <input type="button" value="«" style="height: 200px" onmousedown="scrollDiv('MyDiv', 10)" onmouseup="clearTimeout(timer1)" />
</div>

<div id="MyDiv" class="hscroll">Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_Comapare_

</div>
<div class="rightbutton";>
  <input type="button" value="»" style="height: 200px" onmousedown="scrollDiv('MyDiv', -10)" onmouseup="clearTimeout(timer1)" />
</div>

Answer 1

在输入标记内，您有以下内容：

style="height: 200px"

这就是为什么按钮总是200px高。如果你想要它们是50px那么你可以在这里改变它。或者，您可以使用以下方法删除样式属性并在CSS中设置高度：

.rightbutton input {
    height: 50px;
}

.leftbutton input {
    height: 50px;
}

Answer 2

例如，您可以使用button元素：

<div class="rightbutton";>
  <button value="»" />
</div>

然后您可以在button内为元素div定义一个类。

.rightbutton button, input {
  height: 40px;
}

Answer 3

在你的CSS中，你只是改变了高度，而不是按钮。此外，您需要按钮的元素并从«

更改它

要更改两个按钮的高度，可以将其包含在css中：

<style>
button {
  height: 50px;
}

这是Fiddle demo

如何更改这两个浮动按钮的高度

这里是CSS：

这里是HTML代码：

3 个答案: