Fatal编程技术网

Javascript 画布覆盖整个页面

javascript html css canvas

Javascript 画布覆盖整个页面,javascript,html,css,canvas,Javascript,Html,Css,Canvas,为我的摄影建立一个网站，我正在努力使背景画布覆盖整个页面的高度。此外，画布内的星星有时会拉长——你必须刷新以使它们达到正确的大小 画布的html代码： <body> <canvas id="canvas"></canvas> <header> 链接至第页： 图像：因为您希望画布用作背景图像。为什么不将元件固定在屏幕上 示例位置：固定（您已经将宽度和高度设置为100%） 在CSS中，更改以下内容： .container { wid

为我的摄影建立一个网站，我正在努力使背景画布覆盖整个页面的高度。此外，画布内的星星有时会拉长——你必须刷新以使它们达到正确的大小

画布的html代码：

  <body>
   <canvas id="canvas"></canvas>
  <header>
链接至第页：

图像：

因为您希望画布用作背景图像。为什么不将元件固定在屏幕上

示例
位置：固定
（您已经将宽度和高度设置为100%）


在CSS中，更改以下内容：


.container {
  width: 100%;
  /* position: relative; */
  top: 60px;
  padding-right: 70px;
  padding-left: 60px;
  /* padding-bottom: 30px; */
}



让容器的位置是相对的，填充底部就是在底部创建空白
 为了回答拉长的星星-我在JS的开头添加了一个加载函数：


  window.onload = function() {

     // canvas shiz
 }



当我移除相对定位和底部填充时，仍然有少量空白。这很有效，谢谢。我确实需要在顶部添加一些边距。很高兴听到..：D

.container {
  width: 100%;
  /* position: relative; */
  top: 60px;
  padding-right: 70px;
  padding-left: 60px;
  /* padding-bottom: 30px; */
}



  window.onload = function() {

     // canvas shiz
 }