Question

我在div中使用css在一个页面中显示三个块。可以隐藏水平滚动并启用垂直滚动。下面的代码是为此目的而编写的，但浏览器不考虑为每个div给出的100px的高度。以下是我的代码：标题1

  <body>
    <div>
      <div id="div1" style="float: left; width: 355px; height = 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        1111111111111111111 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
      </div>

      <div id="div2" style="float: left; width: 605px; height = 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        1111111111111111111 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
      </div>

      <div id="div3" style="float: left; width: 360px; height = 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        <div id="div4">
          1111111111111111111 <br>
          1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
          1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        </div>
      </div>

      <br style="clear: left;" />
    </div>

</html>

请帮我解决这个身高问题。

由于 Jagadesh S

Answer 1

您正在使用height = 100px;。这是不正确的语法。它应该是height: 100px;。

<html>
  <head>
    <title> Title1 </title>
  </head>

  <body>
    <div>
      <div id="div1" style="float: left; width: 355px; height: 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        1111111111111111111 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
      </div>

      <div id="div2" style="float: left; width: 605px; height: 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        1111111111111111111 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
      </div>

      <div id="div3" style="float: left; width: 360px; height: 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        <div id="div4">
          1111111111111111111 <br>
          1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
          1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        </div>
      </div>

      <br style="clear: left;" />
    </div>

</html>

使用overflow元素时不考虑CSS高度属性值

1 个答案: