html网页自动铺满屏幕,html – 响应式DIV填满整个屏幕

我正在尝试格式化

HTML DIV元素,以便它在移动设备上响应.我的目标是让潜水始终填充任何移动设备的100％宽度和高度,无论是ipad,iphone还是androd设备. I.E.不同大小的屏幕.

但是,我无法使用此代码执行此操作.哪里和我错了？

我的DIV元素：

id="canvas"

width="400"

height="250"

style="border:3px dashed #000000;">

Go backCapture Signature

我的CSS：

#fullscreen {

height: 100vh;

width: 100vw;

position:fixed;

top:0;

left:0;

background: pink;

@

}

@media screen and (orientation:portrait) { height: 100vh;

width: 100vw; }

@media screen and (orientation:landscape) {height: 100vh;

width: 100vw; }

#footer {

position:absolute;

bottom:0;

width:100%;

height:110px; /* Height of the footer */

background:#6cf;

}

table

{

border-collapse:collapse;

}

table.borderAll

{

border-bottom: 2px solid #000;

}

tr.bottomMedium

{

border-bottom: 2px solid #000;

}

tr.bottomThin

{

border-bottom: 2px solid #000;

}

tr.bottomDouble

{

border-bottom: 2px double #000;

}

tr.last

{

border-bottom: none;

}