1

HTMLファイルを表示する簡単なスクリプトがあります

function doGet(e) {
     return HtmlService.createTemplateFromFile('Final Contract Agreement').evaluate();
}

および対応する html:

 <html>
   <head>
     <style type="text/css">
     #content{
          padding :0 0;
          margin : 0 auto;
          width: 800px;
          height : 600px;
          background: #FFFFFF;
     }
     body{
         background: #dbdad4;
         margin : 0;
     }
     #header{
         width: 100%;
         height: 82px;
         background: #4F2170;
         background-repeat:no-repeat;
     }
     #header h1{
         vertical-align:middle;
         text-align:right;
         color: white;
         padding-right: 50px;
     }
     </style>
 </head>
 <body>
    <div id="header">
      <h1>
         Contract Form
      </h1>
     </div>
    <div id="content">
       <h3>
        Hello World! 
        <?= new Date() ?>
      </h3>
    </div>
  </body>
 </html>

それはこれを出力します：

空白

要素のマージン/パディングのすべての組み合わせを設定しようとしましたが、上部の空白を取り除くものは何もありません。同じコードをプレーン・ジェーンのhtmlファイルに入れると、問題なく動作します。

4

1 に答える 1

1

カハが空白を上部に追加していると推測していますが、このCSSは空白を削除しました：

  * {
    margin: 0;
  }

また、これがブラウザウィンドウ全体を占めるようになった方法だと思っている人のために：

  html {
    height:100%;
  }
  body{
    height:100%;
  }
于 2013-03-07T17:54:00.683 に答える