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. 牛客第五场多校 A gpa 分数规划（模板）

    链接:https://www.nowcoder.com/acm/contest/143/A来源:牛客网 Kanade selected n courses in the university. The ...

  2. Investigating Div-Sum Property UVA - 11361

    An integer is divisible by 3 if the sum of its digits is also divisible by 3. For example, 3702 is d ...

  3. 【LeetCode】116#填充同一层的兄弟节点

    题目描述 给定一个二叉树 struct TreeLinkNode { TreeLinkNode *left; TreeLinkNode *right; TreeLinkNode *next; } 填充 ...

  4. kubernetes ConfigMap和Secret：配置应用程序

    7.1.配置容器化应用程序 7.2.向容器传递命令行参数 7.2.1.待Docker中定义命令与参数 1.了解ENTRYPOINT与CMD ENTRYPOINT定义容器启动时被调用的可以执行程序 CM ...

  5. Redis的最常被问到知识点总结

    1.什么是redis? Redis 是一个基于内存的高性能key-value数据库. 2.Reids的特点 Redis本质上是一个Key-Value类型的内存数据库,很像memcached,整个数据库 ...

  6. Spring Cloud(二)：服务消费者

    创建“服务消费者” 创建一个基础的Spring Boot工程,命名为springboot-consumer,并在pom.xml中引入需要的依赖内容: <dependency> <gr ...

  7. php文件加密解密

    利用base64加解密 base64_encode是加密,而base64_decode是解密 语法:string base64_encode(string data);   语法:string bas ...

  8. CCPC桂林

    在得知我们队伍前往桂林参加CPPC区域赛后,我是非常激动的,因为我们网络赛并没有得到名额,如果不是新都赠予我们名额,我们都没有出去打比赛的机会,同时,我们也不想浪费这个名额,我们也想打出成绩来,于是我 ...

  9. Flink 从 0 到 1 学习 —— 如何自定义 Data Sink ？

    前言 前篇文章 <从0到1学习Flink>-- Data Sink 介绍 介绍了 Flink Data Sink,也介绍了 Flink 自带的 Sink,那么如何自定义自己的 Sink 呢 ...

  10. 进击的.NET 在云原生时代的蜕变

    你一定看过这篇文章 <进击的 Java ,云原生时代的蜕变>,  本篇文章的灵感来自于这篇文章.明天就将正式发布.NET Core 3.0, 所以写下这篇文章让大家全面认识.NET Cor ...