width: calc(100% - 20px);

css3 的 calc()函数。这里的意思是设置宽度比100%的宽度少20px。

calc()函数用于动态计算长度值。

calc()函数支持 "+", "-", "*", "/" 运算；

calc()函数使用标准的数学运算优先级规则；

width: calc(100% - 20px);的更多相关文章

  1. width: calc(100% - 80px); 屏幕自适应方法

    width: calc(100% - 80px); 屏幕自适应方法

  2. CSS width：100%和width：auto的区别

    width:100%和width:auto的区别 width:auto比较聪明,如果margin已经左右占去10px的空间,那么width给的值就是580px. <style> div{ ...

  3. height:calc(100% - 40px)

    在移动端开发的过程中,常常会遇到头部高度是40px,而内容页是除去头部,占满视窗的整个高度,有时候是用js来处理,现在用css的calc是非常方便的: .container{ height: calc ...

  4. less算宽度 加~ width: calc(~"50% - 35px");

    less算宽度 加~  width: calc(~"50% - 35px");

  5. html body width height 100%使用

    首先我们来看一个实际的问题,让body中的一个div占全屏,(问题来源:http://stackoverflow.com/questions/1575141/make-div-100-height-o ...

  6. WPF 中如何变相让 ListBox 宽度（Width） 100%，高度（Height） 100%，从而达到 Filled 的效果

    直接贴代码了: XAML: <Window x:Class="HelloWorld.MainWindow" xmlns="http://schemas.micros ...

  7. CSS的单位及css3的calc()及line-height百分比

    锚点:css中百分比减去固定元素 单位介绍 说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着 ...

  8. calc() ---一个会计算的css属性

    最近这个月一直在赶项目开发,遇到的问题和学到的前端知识没有更新到博客园,现在闲了下来,就整理一下前端知识. 在项目开发中,在样式这方面花费的时间较多,因为针对于数字的变化特别多,本人不爱记数字,在看设 ...

  9. css3 属性——calc()

    其实在之前学习CSS3的时候,我并没有注意到有calc()这个属性,后来在看一个大牛的代码的时候看到了这个,然后就引发了后来的一系列的查找.学习,以及这篇博客的诞生.好了,废话不多说了,来干正事. 一 ...

随机推荐

  1. Paper Reading - Mind’s Eye: A Recurrent Visual Representation for Image Caption Generation ( CVPR 2015 )

    Link of the Paper: https://ieeexplore.ieee.org/document/7298856/ A Correlative Paper: Learning a Rec ...

  2. Python基础知识-05-数据类型总结字典

    python其他知识目录 1.一道题,选择商品的序号.程序员和用户各自面对的序号起始值 如有变量 googs = ['汽车','飞机','火箭'] 提示用户可供选择的商品: 0,汽车1,飞机2,火箭用 ...

  3. SAP(ABAP) ABAP内部外部数据转换常用function

    文本相关CONVERSION_EXIT_CUNIT_OUTPUT      将内部单位转为单位文本CONVERSION_EXIT_ISOLA_OUTPUT      根据语言代码取文本CONVERSI ...

  4. USACO 2.3.4 Money Systems 货币系统（完全背包）

    Description 母牛们不但创建了他们自己的政府而且选择了建立了自己的货币系统. [In their own rebellious way],,他们对货币的数值感到好奇. 传统地,一个货币系统是 ...

  5. Scrum立会报告+燃尽图（十月十七日总第八次）

    本次作业要求参见:https://edu.cnblogs.com/campus/nenu/2018fall/homework/2246 一.小组介绍 组名:杨老师粉丝群 组长:乔静玉 组员:吴奕瑶.公 ...

  6. oracle和DB2的差异

    1.简介 当今IT的环境正经历着剧烈的变化,依靠单一的关系型数据库管理系统(RDBMS)管理数据的公司开始逐渐减少.分析家的报告指出 ,今天超过90%的公司都拥有不只一种RDBMS.在现在紧张的经济情 ...

  7. 获取emacs安装的elpa包名称

    | grep "./" | sed 's/\.\///g' | sed 's/-[0-9].*$//' | sort -u

  8. 201621123037 《Java程序设计》第14周学习总结

    作业14-数据库 标签(空格分隔): Java 1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常相关内容. 2. 使用数据库技术改造你的系统 2.1 简述如何使用数据库技术改造 ...

  9. 201621123037 《Java程序设计》第13周学习总结

    作业13-网络 标签(空格分隔): Java 1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常相关内容. 思维导图: 其他: 网络编程:由客户端和服务器组成 - 服务器端 第一 ...

  10. vue-cli脚手架搭建

    我们使用vue-cli来搭建整个项目,vue-cli就是一个脚手架,步骤很简单,输入几个命令之后就会生成整个项目,里面包括了webpack.ESLint.babel很多配置等等,省了很多事 Vue+ ...