有两种方法:1.JavaScript 2.CSS
1:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
< html xmlns = "http://www.w3.org/1999/xhtml" > |
< head > |
< title >Canvas Resize</ title > |
< script type = "text/javascript" > |
function resize_canvas(){ |
canvas = document.getElementById("canvas"); |
if (canvas.width < window.innerWidth ) |
{ |
canvas.width = window .innerWidth; |
} |
if (canvas.height < window.innerHeight) |
{ |
canvas.height = window .innerHeight; |
} |
} |
</script> |
</ head > |
< body onresize = "resize_canvas()" > |
< canvas id = "canvas" >Your browser doesn't support canvas</ canvas > |
</ body > |
</ html > |
2:
< html > |
< head > |
< style type = "text/css" > |
#myCanvas { |
height: 100%; width: 100%; border: 1px solid black; |
} |
</ style > |
</ head > |
< body > |
< canvas id = "myCanvas" >(Your browser doesn't support canvas)</ canvas > |
</ body > |
</ html > |