对calc()的研究
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()的研究的更多相关文章
- 有关信息ACM/ICPC竞争环境GCC/G++叠插件研究记录的扩展
0.起因 有时.DFS总是比BFS受人喜爱--毕竟DFS简单粗暴,更,而有些东西BFS不要启动,DFS它似乎是一个可行的选择-- 但是有一个问题,DFS默认直接写入到系统堆栈.系统堆栈和足够浅,此时O ...
- 深入研究-webkit-overflow-scrolling:touch及ios滚动
1. -webkit-overflow-scrolling:touch是什么? MDN上是这样定义的: -webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效 ...
- Css3新属性:calc()
一.前言 calc()看起来像是javascript中的一个函数,而事实上它是用在Css中的,可以用它来计算长度(宽度或高度),能够自动根据不同尺寸的屏幕自动调接数值,从而很轻松的实现自适应布局展示在 ...
- 机器学习进阶-直方图与傅里叶变换-图像直方图 1.cv2.calc(生成图像的像素频数分布(直方图))
1. cv2.calc([img], [0], mask, [256], [0, 256]) # 用于生成图像的频数直方图 参数说明: [img]表示输入的图片, [0]表示第几个通道, mask表 ...
- BZOJ4241:历史研究(回滚莫队)
Description IOI国历史研究的第一人——JOI教授,最近获得了一份被认为是古代IOI国的住民写下的日记.JOI教授为了通过这份日记来研究古代IOI国的生活,开始着手调查日记中记载的事件. ...
- 利用CSS函数calc(...)实现Web页面左右布局
前言 因为自己的网站需要,想要做一个左右布局的页面: 左边是导航菜单之类的东西.右边是文档内容(因为最近看的一些软件的文档页面都是这么布局的): 左边固定宽度——300像素.右边使用剩余的宽度: 左边 ...
- BZOJ 1968_P1403 [AHOI2005]约数研究--p2260bzoj2956-模积和∑----信息学中的数论分块
第一部分 P1403 [AHOI2005]约数研究 题目描述 科学家们在Samuel星球上的探险得到了丰富的能源储备,这使得空间站中大型计算机“Samuel II”的长时间运算成为了可能.由于在去年一 ...
- Windows下非PE方式载荷投递方式研究
0. 引言 0x1:载荷是什么?在整个入侵过程中起到什么作用? 载荷的作用在整个入侵链路的作用起到纽带的作用,它借助于目标系统提供的某些功能:组件:执行环境,将攻击者的传递的恶意payload包裹起来 ...
- css3的calc属性不生效问题
css3的 calc:计算属性.由于自己做的项目中这个属性不常用到,偶尔用一次还没效果. 后来研究了下是因为运算符两边没加空格. 错误示例:.content{width:calc(100%-50px) ...
随机推荐
- Splinter 的认识和基础应用
Splinter 是一个使用Python开发的开源web应用测试程序,它可以帮助我们实现自动浏览站点和与其进行交互.它是依赖于其它python插件或拓展进行的,所以我们使用它之前需要安装一系列的依赖包 ...
- Gym 100507H - Pair: normal and paranormal
题目链接:http://codeforces.com/gym/100507/attachments -------------------------------------------------- ...
- kill的各种讯号?
kill 程序 不仅仅只是k掉某个进程, 她还有很多作用和用途. 其实, 这也是linux的程序的一个特点: 一个程序(很多是 命令行的程序), 除了主要的作用外, 还有很多" 重要的, 有 ...
- PHP图片处理
开启GD扩展(php_gd2.dll) 创建画布 画布:一种资源型数据,可以操作的图像资源. 创建新画布(新建) ImageCreate(宽,高);创建基于调色板的画布. imageCreateTru ...
- EDM实例之15个节日邮件标题分享
调查显示,去年节假日,47%的消费者打开节日邮件是因为邮件主题内容吸引.为了让企业获得更多的交易,帮助企业在繁忙的节假日内不畏竞争,全国知名的EDM邮件服务商Focussend历经多年行业的实践分析, ...
- 3 hadoop安装Standalone模式和伪分布式模式
1 Standalone模式默认模式,即默认配置即是standalone模式装好hadoop-client,会将依赖的包安装好yum install hadoop-client配置文件各个配置文件在/ ...
- Android Bitmap变迁与原理解析(4.x-8.x)
App开发不可避免的要和图片打交道,由于其占用内存非常大,管理不当很容易导致内存不足,最后OOM,图片的背后其实是Bitmap,它是Android中最能吃内存的对象之一,也是很多OOM的元凶,不过,在 ...
- Postman Tests脚本的使用
直接在Tests中写js代码断言结果,Test Result展示运行结果,简单方便. 示例脚本: var jsonData = JSON.parse(responseBody); var num = ...
- mysql恢复备份导出
MySQL-5.7 备份与恢复 一.备份分类 按介质分类: 物理备份指通过拷贝数据库文件方式完成备份,适用于数据库很大,数据重要且需要快速恢复的数据库. 逻辑备份指通过备份数据库的逻辑结构和数据内 ...
- [Udemy] ES 7 and Elastic Stack - part 1
Section 1 基本概念: Index(indices) 相当于 关系型数据库的 table, document 相当于关系型数据库的 row, 还有一个type的概念(可以理解为table的s ...