Question

好的，这是我的第一个html / css / javascript网站。我不确定基本上出了什么问题我使用css使背景图像适合，然后我尝试使用

添加图像链接

    <div id="project_button" style="position:relative; top: 1000px; left: 1000px" >

结果是水平滚动条上的1000像素滚动室。当我尝试使用

编辑位置时，会出现类似的结果

    margin-left:1000px
    margin-top: 1000px

除了它将是具有额外空间的垂直滚动条。

    <html>
          <head>
          <title>Home Page</title>
          <head>
          <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
          <meta http-equiv="Imagetoolbar" content="no">
          <SCRIPT LANGUAGE="JavaScript">
          <!--

          if (document.images) {

          var button1_up = new Image();
          button1_up.src = "project1.gif";

          var button1_over= new Image();
          button1_over.src = "project2.gif";
          }

          function over_button(){
           if (document.images) {
       document["buttonOne"].src = button1_over.src
      }
    }

          function up_button() {
               if (document.images) {
               document["buttonOne"].src = button1_up.src
          }
    }
    //-->
    </SCRIPT>
    <style type="text/css">
    html {height:100%;}

    body {height:100%; margin:0; padding:0;}

    #bg {position:fixed; top:0; left:0; width:100%; height:100%;}


    </style>
    <!--[if IE 6]>
    <style type="text/css">
    html {overflow-y:hidden;}
    body {overflow-y:auto;}
    #bg {position:absolute;
    padding-right:800px;
    margin-right:-800px;}

    #project_button {position:static;}
    </style>
    <![endif]-->
    </head>
    <body>
          <div id="page1" style='position: relative'>   
      <div id="bg"><img src="WebBacking.jpg" width="100%" height="100%" alt="">
          </div>
      <div id="project_button" style="position:relative; top: 1000; left: 1000" >
        <a href="projects.html" onMouseOver="over_button()"
                 onMouseOut="up_button()">
        <img src="project1.gif" alt="click me" 
        width="1800" height="200" name="buttonOne" 
        border=0>
        </a>
      </div>
          </div>

    </body>
    </html>

这是我的其余代码。任何帮助表示赞赏。

btw当我垂直或水平滚动时，背景仍然适合但是因为图像的位置是静态的，所以当滚动时它会移动。我还应该提一下，当我设置

  top: 0; left:0;

滚动条被删除。这也适用于最高利润率。

Answer 1

如果您不想在某些元素中添加滚动条，请将overflow:hidden添加到css中。这样，元素外部的所有内容都将被剪裁，并且不会显示滚动条。

Answer 2

另请尝试overflow:auto。当内容溢出时，它会显示滚动条。

如何摆脱CSS上无用的滚动空间

2 个答案: