2016-12-17 131 views
-1

我想将图像设置为画布,但我无法做到。我无法找到任何错误。画布出现在inspect element上,但图像未设置。设置画布的背景图像

<!doctype html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <meta http-equiv="x-ua-compatible" content="ie=edge"> 
     <title></title> 
     <meta name="description" content=""> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <!-- <link rel="stylesheet" href="CSS/styling.css"> 
     <script src="JavaScript/setImage.js"></script>--> 
    </head> 
    <body> 

    <canvas id="canvas" style="color: #0cff15; -webkit-background-image: url(/cheque.jpg)" ></canvas> 

    </body> 
</html> 

回答

0

你可以使用css设置背景图像,你也应该给宽度和高度属性。请参阅下面的演示。

#canvas{ 
 
    color: #0cff15; 
 
    background-image: url("http://www.backgroundsy.com/file/dust-background.jpg"); 
 
    -webkit-background-image: url("http://www.backgroundsy.com/file/dust-background.jpg"); 
 
    border:1px solid black; 
 
    width:500px; 
 
    height:500px; 
 
}
<canvas id="canvas"></canvas>

+0

哪里链接/ –

+0

对不起兄弟我的坏..点击运行代码片段 –

1

您不像样式div样式帆布元素。你必须通过javascript获取它的上下文并将其绘制。搜索“mdn canvas”获取文档并阅读一下。