宽度等于父元素的宽度减去16像素
高度等于父元素的高度减去16像素
注意:100%和16px   与减号之间必须有空格,否则高度会失效!!!!
.box{
  width:calc(100% - 16px);
  height:calc(100% - 16px);
  margin:8px;
 
}
 

css 计算属性 calc的使用的更多相关文章

  1. css计算属性 calc()

    left: calc((100vw - 400px) / 2);   calc 进行简单的运算时,运算符号左右各要有一个空格,不然不起作用.

  2. css3中样式计算属性calc()的使用和总结

    calc的介绍 在css3样式中有一个类似与函数的计算属性calc(),它主要用于指定元素的长度,无论是border.margin.pading.font-size和width等属性都可以使用calc ...

  3. css3计算属性(calc)

    如果有固定头部高度和底部高度,内容的高度或者宽度想要根据浏览器屏幕自适应的话,可以用到css3的计算属性,即calc. 用法如下: 内容区域高/宽 = calc(100% - 头部高宽 - 底部高宽) ...

  4. 20190614笔记(颜色透明度,css,filter,滤镜,计算属性,json和formData转换)

    今天忙里偷闲,把最近做的笔记做一下整理. 1.json和formData互相转换 适用场景:对接后台接口.后台接口写的因人而异,不同的人有不同的风格.比如,文件上传,原本就是formData格式,有人 ...

  5. CSS中新属性calc()

    CSS3的calc()使用 原文: http://www.w3cplus.com/css3/how-to-use-css3-calc-function.html © w3cplus.com calc( ...

  6. 纯CSS实现自动轮播,CSS变量的定义与使用,计算属性的使用

    先来看一下实现的效果: 实现原理: HTML中使用ul>li存放图片 CSS使用CSS3的animation来完成动画 <!-- HTML --> <section class ...

  7. 【演示】在CSS里用calc进行计算

    请阅读 在CSS里用calc进行计算   下面的元素的width,padding,margin都使用了CSS calc进行计算. 简单计算: 100% – 100px 这是经过简单计算的元素宽度 复杂 ...

  8. css中新增的属性calc()可以计算使用

    什么是calc: calc是英文单词calculate(计算)的缩写,是css3的一个新增的功能,用来指定元素的长度.可以使用calc()给元素的border.margin.pading.font-s ...

  9. 【转】CSS z-index 属性的使用方法和层级树的概念

    文章转自:CSS z-index 属性的使用方法和层级树的概念,另外加了一点自己的注释 CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有更高堆叠顺序的节点将显示在堆叠顺序较低的节点前面 ...

随机推荐

  1. Django SimpleCMDB API

    编写一个API,当我们访问 http://192.168.216.128:8000/hostinfo/getjson 时,返回 json 格式的主机组和组成员信息: [root@localhost S ...

  2. PPT高手必须树立的十个理念

    08 2014年08月 [263职场技巧]PPT高手必须树立的十个理念 理念一:文字是用来瞟的,不是读的 我们时不时听到这样的言论:“PPT很简单,就是把Word里的文字复制.粘贴呗.”这其实是对PP ...

  3. using 释放内存的写法

    using (FileStream fileStream = File.Open(fileName,FileMode.Open,FileAccess.Read,FileShare.ReadWrite) ...

  4. 《JavaScript 秘密花园》

    恰巧今天是传统民间重要的节日之一--七夕节: 被大家挂在嘴上最多的一句话便是:有对象了吗?这不-- 这样的话,那咱就先给new出一个对象吧: var boyfriend = new Object(); ...

  5. codeforces水题100道 第六题 Yandex.Algorithm 2011 Qualification 2 A. Double Cola (math)

    题目链接:www.codeforces.com/problemset/problem/82/A题意:五个人排队喝可乐,一个人喝完一杯,就在可乐的最后面放两杯自己喝的可乐,问第n个喝的人是谁.C++代码 ...

  6. 剑指offer——49

    丑数 因子只含2,3,5的数称为丑数. 怎么求第K大的丑数呢.K可以为10^7 最简单的做法是,对每个数判断是否为丑数. 复杂度为O( n * log(n) ),理论上是不行的. uglys[i] 来 ...

  7. mysql学习笔记-创建用户以及登录,基本信息查询

    第一天: 创建一个mysql账号:create user ‘新的用户名’@‘localhost’identified by ‘口令’: Now()显示当日日期和时间,user()显示当前的用户,ver ...

  8. Servlet 简单介绍

    来源于菜鸟教程http://www.runoob.com/servlet/servlet-intro.html Servlet 简介 Servlet 是什么? Servlet(Server Apple ...

  9. python 函数式编程:高阶函数,map/reduce

    python 函数式编程:高阶函数,map/reduce #函数式编程 #函数式编程一个特点就是,允许把函数本身作为参数传入另一个函数,还允许返回一个函数 #(一)高阶函数 f=abs f print ...

  10. Sencha Touch 实战开发培训 视频教程 第二期 第五节

    2014.4.16 晚上8:20分开课. 本节课耗时没有超出一个小时,主要讲解了Sencha Touch 结合百度地图的用法. 本期培训一共八节,前两节免费,后面的课程需要付费才可以观看. 本节内容: ...