javascript方法：

var oC=document.querySelectorAll('canvas')[0];
oC.width=document.documentElement.clientWidth;
oC.height=document.documentElement.clientHeight;
//oC.width=window.innerWidth;
//oC.height=window.innerHeight;

css方法：

html,body{width:100%;height:100%;margin:0;overflow:hidden;}
body{background:#000;}
canvas{background:#fff;height:100%;width:100%;}

作者：smile.轉角

QQ：493177502

【html5】如何让Canvas标签自适应设备的更多相关文章

  1. [html5] 学习笔记-Canvas标签的使用

    Canvas通过JavaScript来绘制2D图形.Canvas是逐像素渲染的.在Canvas中,一旦图形被绘制完成,它就不会继续得到浏览器的关注.如果其位置发生变化,那么整个场景也需要重新绘制,包括 ...

  2. HTML5新增Canvas标签及对应属性、API详解（基础一）

    知识说明: HTML5新增的canvas标签,通过创建画布,在画布上创建任何想要的形状,下面将canvas的API以及属性做一个整理,并且附上时钟的示例,便于后期复习学习!Fighting! 一.标签 ...

  3. Atitit html5 Canvas 如何自适应屏幕大小

    Atitit  html5 Canvas 如何自适应屏幕大小     可以用JS监控屏幕大小,然后调整Canvas的大小.在代码中加入JS 1 2 3 4 5 6 7 $(window).resize ...

  4. 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解，html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理

    [微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...

  5. html5之canvas困惑 在canvas标签内需要设置了宽跟高，如果在css中设置同样的宽跟高，画出来的图像变形了？

    <canvas class="cvs"></canvas> 遇到的问题: 如css 中设.cvs{width:500px;height:400px;},也就 ...

  6. HTML5 canvas标签绘制正三角形 鼠标按下点为中间点，鼠标抬起点为其中一个顶点

    用html5的canvas标签绘制圆.矩形比较容易,绘制三角形,坐标确定相当于前面两种难点,这里绘制的是正三角形,比较容易,我们只需要把鼠标刚按下去的点设置为三角形的中心点,鼠标抬起的点设置为三角形右 ...

  7. HTML5<canvas>标签:使用canvas元素在网页上绘制线条和圆(1)

    什么是 Canvas? HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像. 画布是一个矩形区域,您可以控制其每一像素. canvas 拥有多种绘制路径.矩形.圆形.字符以 ...

  8. HTML5<canvas>标签:简单介绍(0)

    <canvas> 标签是 HTML 5 中的新标签,像所有的dom对象一样它有自己本身的属性.方法和事件, 其中就有绘图的方法,js能够调用它来进行绘图 ,最近在研读<html5与c ...

  9. html5 canvas标签

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 解决SharePoint 2010拒绝访问爬网内容源错误

    今天发现SP爬网出现了问题,持续时间蛮长的,一直爬不到内容. 解决方案: 这里有一条解决在SharePoint 2010搜索爬网时遇到的"拒绝访问错误"的小技巧. 首先要检查默认内 ...

  2. break与continue,return结束循环区别

    break是跳出一层循环,continue是结束一趟循环 ,return才是结束所有层循环! 如果有多层for循环,break会跳出当前这一层,去执行最外层循环(而不是退出所有层循环);而contin ...

  3. ubuntu安装ftp server服务

    原文地址: https://jingyan.baidu.com/article/7908e85c988b23af481ad2ae.html 首先,更新软件源,保证源是最新的,这样有利于下面在线通过ap ...

  4. java中自己常犯的错误汇总

    package debug; /** 1.定义一个公共的动物类,包含名字.年龄.颜色和吃饭东西方法 2.定义一个猫类,继承动物类,同时拥有玩游戏的本领 3.定义一个狗类,继承动物类,同时拥有看门的本领 ...

  5. MVC中Controller与View中间的数据传递的常用方法

    这几天正在学习MVC,顺便就将自己每天的学习心得记录下来与大家分享一下吧! 在MVC中,Controller与View之间传递数据是很频繁的事情,所以在这里就总结一下我自己在学习中使用的几种常用的方法 ...

  6. Python: tree data structure

    # 树结构 from pythonds.basic.stack import Stack #pip install pythonds from pythonds.trees.binaryTree im ...

  7. 【读书笔记】iOS-iCloud文件备份

    iOS应用在运行时经常要创建一些文件,不过这些文件要如何存放呢?有没有什么要求呢? 由于手机资源空间有限而且考虑到Apple推出的iCloud,我们确实要对创建出的文件按照作用的不同,分出几种类别出来 ...

  8. Docker简单使用

    镜像是一种轻量级.可执行的独立软件包,它包含运行某个软件所需的所有内容,包括代码.运行时.库.环境变量和配置文件. 容器是镜像的运行时实例 - 实际执行时镜像会在内存中变成什么.默认情况下,它完全独立 ...

  9. loadrunner 脚本开发-url解码

    url解码 by:授客 QQ:1033553122 脚本结构如下: Action.c中的代码如下: int htoi(char *s) { int value = 0; int c = 0; c = ...

  10. (网页)javascript小技巧(非常全)

    事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture();  event.srcE ...