width:calc(100% - 20px);
width:-webkit-calc(100% - 20px);//chrome
width:-moz-calc(100% - 20px);//firefox
height:calc(80% + 20px);
height:-webkit-calc(80% + 20px);//chrome
height:-moz-calc(80% + 20px);//firefox

特别注意:+或者-两边都要用空格隔开!!!

【CSS】width和height计算的更多相关文章

  1. JQuery获取元素宽度.width()与.css(‘width’)两个函数的区别

    整理翻译自:http://blog.jquery.com/2012/08/16/jquery-1-8-box-sizing-width-csswidth-and-outerwidth/ 大意是: 在J ...

  2. CSS中width和height与盒子模型的关系

    盒子模型 css中盒子模型包含属性margin.border.padding.width与height,他们可以把它转移到我们日常生活中的盒子(箱子)上来理解,日常生活中所见的盒子也具有这些属性,所以 ...

  3. 【CSS中width、height的默认值】

    对于初学者来说,CSS中的width.height的默认值是很神奇的,因为经常看到如下这样的代码:明明只给一个#father标签(红色的div)设置了一个width,为啥它在浏览器中显示出来是有一个固 ...

  4. IE6以下版本对元素width和height的处理与CSS标准的兼容性问题

    1.CSS使用width和height定义元素框的内容,Windows平台的IE6以下版本浏览器并未按照标准处理而是使用width和height来定义可见元素框的尺寸,IE/win使用width来描述 ...

  5. canvas基础入门(一)canvas的width、height于css样式中的宽高区别

    canvas的width.height于css样式中的宽高对画布的内容显示是有所区别的 1.在canvas标签下调用他的width和height,而且是没有单位的宽高,这种指定canvas大小的方法也 ...

  6. css中width和height默认值

    width和height默认都是auto自动伸缩的,但不同的标签效果却不一样比如div默认是width:100%,通常不用写100%如果是table,如果div内的table没有设定100%,那就是最 ...

  7. CSS过渡约束的计算

    CSS过度约束性质 什么是CSS过度约束 当没有开启绝对定位或固定定位时 水平布局必须要满足以下等式 探寻能够设置成auto的CSS属性 等式不成立(过度约束)时的几种情况 当margin与width ...

  8. 看完就懂--CSS选择器优先级的计算

    CSS选择器优先级的计算 什么是选择器的优先级 优先级的计算与比较(一) - 优先级具有可加性 - 选择器优先级不会超过自身最大数量级 - 同等优先级情况下,后写的覆盖前写的 - 并集选择器之间的优先 ...

  9. H5 canvas的 width、height 与style中宽高的区别

    Canvas 的width height属性 1.当使用width height属性时,显示正常不会被拉伸:如下 <canvas id="mycanvas" width=&q ...

随机推荐

  1. HDU 5793 A Boring Question 多校训练

    There are an equation. ∑0≤k1,k2,⋯km≤n∏1⩽j<m(kj+1kj)%1000000007=?∑0≤k1,k2,⋯km≤n∏1⩽j<m(kj+1kj)%1 ...

  2. Educational Codeforces Round 69 (Rated for Div. 2)

                                                                                                  A. DIY ...

  3. 网络流---最大流(Edmond-Karp算法)的学习

    先上个代码,等有空补充详解 #include<iostream> #include<cstdio> #include<cstring> #include<cm ...

  4. Jenkins教程(五)构建Java服务Docker镜像

    本文主旨 主要记录下如何使用Jenkins构建Java服务的Docker镜像,以及手动部署测试下 前期准备 已安装Jenkins 为jenkins用户添加到docker组内 本地装有maven,配置或 ...

  5. 利用HBuilder打包Vue开发的webapp为app

    众所周知,前端开发完成的webapp只能运行在浏览器上,对运行环境有一定的限制,也就是除了浏览器其他的环境下不支持:那么现在如果有个需求是这样的呢?需要一套代码三端运行呢?三端运行(黑人脸??)是的, ...

  6. Python中使用python -m pip install --upgrade pip升级pip时老是不成功

    场景 在使用python -m pip install --upgrade pip进行pip升级时,每次到最后就是报一大堆红色,最终升级不成功. 实现 使用默认的镜像源时间过长就会没响应,使用豆瓣的镜 ...

  7. Winform中使用printDocument控件打印pictureBox中的二维码照片

    场景 Winform中使用zxing和Graphics实现自定义绘制二维码布局: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/1 ...

  8. Node.js之异步编程

    > 文章原创于公众号:程序猿周先森.本平台不定时更新,喜欢我的文章,欢迎关注我的微信公众号. ![file](https://img2018.cnblogs.com/blog/830272/20 ...

  9. Mongodb关于查询返回指定字段的方法记录

    //通常指定字段由前端传入后台,例如params 前端以逗号分隔 //后端获取字段后操作如下: Query query = new Query(); if (params != null) { Str ...

  10. 游戏设计模式——Unity对象池

    对象池这个名字听起来很玄乎,其实就是将一系列需要反复创建和销毁的对象存储在一个看不到的地方,下次用同样的东西时往这里取,类似于一个存放备用物质的仓库. 它的好处就是避免了反复实例化个体的运算,能减少大 ...