calc()可以给元素做运算，

calc(expression)

eg:

.a {

　　width: -webkit-calc(100% - 2px);

　　width: -moz-calc(100% - 2px);

　　width: calc(100% - 2px);

}

语法:

1.可以使用+ - * %()等运算符

2.可以使用百分比，px,em,rem计算其css属性

3.+ - 运算符前后必须有空格，* %可以没有，但为了保持一致性最好也加上

4.写时得考虑兼容性

兼容性:

IE9+、FF4.0+、Chrome19+、Safari6+,移动端部分支持

详情可查看: http://www.w3cplus.com/css3/how-to-use-css3-calc-function.html

calc()使用笔记的更多相关文章

  1. ES6笔记（3）-- 解构赋值

    系列文章 -- ES6笔记系列 解构赋值,即对某种结构进行解析,然后将解析出来的值赋值给相关的变量,常见的有数组.对象.字符串的解构赋值等 一.数组的解构赋值 function ids() { ret ...

  2. CSS揭秘读书笔记 （一）

    CSS揭秘读书笔记      (一) 一.半透明边框 要想实现半透明边框可以使用border: border: 10px  solid  hsla(0,0%,100%,.5); background: ...

  3. 安卓第九天笔记-Activity

    安卓第九天笔记-Activity 1.创建Activity 一个界面对应一个activity 创建一个Activity  1.写一个JAVA类,继承Activity publicclass CalcA ...

  4. 我的Python基础笔记

    Python是从刚开始参加工作,就有听各方面的测试大牛推崇,但是刚开始做测试时还是把基础的测试方法放在第一位来学习的,直到半年多以后才开始接触Python. 我的Python基础主要是以廖雪峰老师的在 ...

  5. NSIS学习笔记(转)

    转自:http://blog.csdn.net/lee353086/article/details/45919901 NSIS学习笔记Date:2015-05-20Author:kagulaEnv:V ...

  6. Android（java）学习笔记219：开发一个多界面的应用程序之两种意图

    1.两种意图: (1)显式意图: 在代码里面用intent设置要开启Activity的字节码.class文件: (2)隐式意图: Android(java)学习笔记218:开发一个多界面的应用程序之人 ...

  7. 最全的ORACLE-SQL笔记

    -- 首先,以超级管理员的身份登录oracle sqlplus sys/bjsxt as sysdba --然后,解除对scott用户的锁 alter user scott account unloc ...

  8. es6笔记1^_^let、string、number、math

    ECMAScript是一种由Ecma国际(前身为欧洲计算机制造商协会,英文名称是European Computer Manufacturers Association)通过ECMA-262标准化的脚本 ...

  9. LaTeXの学习笔记

    听说LaTeX挺有趣,决定学习一下提升自己的境(逼)界(格),借鉴了许多大神的经验与笔记,希望能坚持下去......(*￣;(￣ *) 1.论文写作的三种格式 eg. \documentclass{a ...

随机推荐

  1. jQuery第五章

    jQuery对表单.表格的操作以及更多应用 一.表单应用 1.单行文本框应用 (1)获取和失去焦点改变样式 HTML代码如下: <form action="#" method ...

  2. 谷歌浏览器js debug

  3. PHP关于数组缓存JSON、serialize、var_export的说明

    1.JSONJSON缓存变量主要是使用json_encode和json_decode函数,其中json_encode可以将变量变成文本格式存储到文件. // Store cache file_put_ ...

  4. 用Bash脚本将Linux普通用户添加为系统管理员

    将Linux普通用户添加为系统管理员在Gnome或KDE这样强大与完善的桌面环境下是非常简单的事情,一般来说在用户设置的对话框里就直接有相应选项.不过,出于简洁与高效的风格,自己目前并未使用这些高端但 ...

  5. 分享到QQ空间、新浪微博、腾讯微博和人人网

    function shareys(type, url, title, img, content) { switch (type) { case "sina": url = &quo ...

  6. Gentoo安装详解（四）-- 声卡设置

    硬件检测 To choose the right driver, first detect the used audio controller. You can use lspci for this ...

  7. NOIP2005-普及组复赛-第一题-陶陶摘苹果

    题目描述 Description 陶陶家的院子里有一棵苹果树,每到秋天树上就会结出10个苹果.苹果成熟的时候,陶陶就会跑去摘苹果.陶陶有个30厘米高的板凳,当她不能直接用手摘到苹果的时候,就会踩到板凳 ...

  8. SpringMvc+thymeleaf+HTML5中文乱码问题

    SpringMvc+thymeleaf+HTML5环境下遇到中文乱码...... 按照以往经验逐个排查,开发环境统一为utf-8编码,服务器也配置了编码过滤器,tomcat也是utf-8编码.前台页面 ...

  9. js添加div

    有这样一段div布局 <div class="clearfix">    <p class="left c">        <s ...

  10. div盒子水平垂直居中的方法

    这个问题比较老,方法比较多,各有优劣,着情使用. 一.盒子没有固定的宽和高 方案1.Transforms 变形 这是最简单的方法,不仅能实现绝对居中同样的效果,也支持联合可变高度方式使用.内容块定义t ...