1.calc是英文单词calculate(计算)的缩写,是css3的一个新增的功能,用来指定元素的长度 calc()最大的好处就是用在流体布局上

2.calc()使用通用的数学运算规则

  • 使用“+”、“-”、“*” 和 “/”四则运算;
  • 可以使用百分比、px、em、rem等单位;
  • 可以混合使用各种单位进行计算;
  • 表达式中有“+”和“-”时,其前后必须要有空格,如"widht: calc(12%+5em)"这种没有空格的写法是错误的;
  • 表达式中有“*”和“/”时,其前后可以没有空格,但建议留有空格。

3.兼容性

/*Firefox*/
-moz-calc(expression);
/*chrome safari*/
-webkit-calc(expression);
/*Standard */
calc();

对calc()的研究的更多相关文章

  1. 有关信息ACM/ICPC竞争环境GCC/G++叠插件研究记录的扩展

    0.起因 有时.DFS总是比BFS受人喜爱--毕竟DFS简单粗暴,更,而有些东西BFS不要启动,DFS它似乎是一个可行的选择-- 但是有一个问题,DFS默认直接写入到系统堆栈.系统堆栈和足够浅,此时O ...

  2. 深入研究-webkit-overflow-scrolling:touch及ios滚动

    1. -webkit-overflow-scrolling:touch是什么? MDN上是这样定义的: -webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效 ...

  3. Css3新属性:calc()

    一.前言 calc()看起来像是javascript中的一个函数,而事实上它是用在Css中的,可以用它来计算长度(宽度或高度),能够自动根据不同尺寸的屏幕自动调接数值,从而很轻松的实现自适应布局展示在 ...

  4. 机器学习进阶-直方图与傅里叶变换-图像直方图 1.cv2.calc(生成图像的像素频数分布(直方图))

    1. cv2.calc([img], [0], mask, [256], [0, 256])  # 用于生成图像的频数直方图 参数说明: [img]表示输入的图片, [0]表示第几个通道, mask表 ...

  5. BZOJ4241:历史研究(回滚莫队)

    Description IOI国历史研究的第一人——JOI教授,最近获得了一份被认为是古代IOI国的住民写下的日记.JOI教授为了通过这份日记来研究古代IOI国的生活,开始着手调查日记中记载的事件. ...

  6. 利用CSS函数calc(...)实现Web页面左右布局

    前言 因为自己的网站需要,想要做一个左右布局的页面: 左边是导航菜单之类的东西.右边是文档内容(因为最近看的一些软件的文档页面都是这么布局的): 左边固定宽度——300像素.右边使用剩余的宽度: 左边 ...

  7. BZOJ 1968_P1403 [AHOI2005]约数研究--p2260bzoj2956-模积和∑----信息学中的数论分块

    第一部分 P1403 [AHOI2005]约数研究 题目描述 科学家们在Samuel星球上的探险得到了丰富的能源储备,这使得空间站中大型计算机“Samuel II”的长时间运算成为了可能.由于在去年一 ...

  8. Windows下非PE方式载荷投递方式研究

    0. 引言 0x1:载荷是什么?在整个入侵过程中起到什么作用? 载荷的作用在整个入侵链路的作用起到纽带的作用,它借助于目标系统提供的某些功能:组件:执行环境,将攻击者的传递的恶意payload包裹起来 ...

  9. css3的calc属性不生效问题

    css3的 calc:计算属性.由于自己做的项目中这个属性不常用到,偶尔用一次还没效果. 后来研究了下是因为运算符两边没加空格. 错误示例:.content{width:calc(100%-50px) ...

随机推荐

  1. React - 可控组件和非可控组件的选择

    原则 受控组件(用户输入 ---> state 更新 ---> 组件更新)的消耗明显比非受控组件大的多,但非受控组件只能在需求非常简单的情况下的使用. 特性 uncontrolled 受控 ...

  2. spring切换环境变量——@Profile注解的使用

    在容器中如果存在同一类型的多个组件,也可以使用@Profile注解标识要获取的是哪一个bean,这在不同的环境使用不同的变量的情景特别有用.例如,开发环境.测试环境.生产环境使用不同的数据源,在不改变 ...

  3. RocketMQ 创建和删除 topic,以及 broker 和 nameserver 之间的心跳

    命令行主类:org.apache.rocketmq.tools.command.MQAdminStartup 客户端创建 topic 程序参数:updateTopic -n localhost:987 ...

  4. 多线程threading初识,线程等待

    1.线程是程序里面最小的执行单元. 2.进程是资源的集合. 线程是包含在进程里面的,一个进程可以有多个线程,但只要要有一个线程. 一.多线程,就是N个线程一起干活: 1.传统方式,串行,循环5次需要1 ...

  5. python常用包官网

    Pandas http://pandas.pydata.org/pandas-docs/stable/reference/api/pandas.Series.reset_index.html?high ...

  6. C# datatable 导出到Excel

    datatable导出到Excel /// <summary> /// 将DataTable导出为Excel文件(.xls) /// </summary> /// <pa ...

  7. LeetCode——142 设计链表2

    题目 代码 class Solution { public: ListNode *detectCycle(ListNode *head) { ListNode *fast = head, *slow ...

  8. 浅谈vue单页面seo问题

    最近做项目的时候,被要求做seo,由于项目已经开发完毕,且只需首页做seo,所以考虑再三,决定用prerender-spa-plugin结合vue-meta-info来实现首页的seo.如果你的页面是 ...

  9. python函数-基础知识

    一.含义函数是程序内的“小程序” 二.示例 #!/usr/bin/env python #coding:utf-8 def hello(): print('Hello world!') print(' ...

  10. #10017 传送带(SCOI 2010)(三分套三分)

    [题目描述] 在一个 2 维平面上有两条传送带,每一条传送带可以看成是一条线段.两条传送带分别为线段 AB 和线段 CD.lxhgww 在 AB上的移动速度为 P ,在 CD 上的移动速度为 Q,在平 ...