最近在布局的时候遇到一个问题，在页面中的左侧是侧边栏，右边是内容区域，内容区域中有一个固定定位的标签页，在设置固定定位的标签设置宽度的时候应该是内容区域的宽度，而固定定位的时候相对于是窗口的宽度，所以转换为了当前窗口的宽度减去左侧的侧边栏的宽度

开始在网上查了查有个calc属性是可以写表达式的，但是自己使用的时候却没有效果，自己测试了半天才发现是写法的错误

width: calc（100% - 10px）;

在写的时候需要在运算符的左右都加上空格才能生效

css3中的calc的使用的更多相关文章

  1. CSS3中的calc()

    什么是calc()? calc是英文单词calculate(计算)的缩写,是css3的一个新增的功能; MDN的解释为可以用在任何长度,数值,时间,角度,频率等处; /* property: calc ...

  2. Css3中的 calc()使用

    http://www.w3cplus.com/css3/how-to-use-css3-calc-function.html

  3. less中使用calc

    css3中可以使用calc()来实现自适应布局 例如:width:“calc(100%  - 25px)” width: calc(expression); ==> expression是一个表 ...

  4. 浏览器中使用calc不识别

    在使用css3中的calc运算函数时,发现浏览器不识别,当时代码是这样的 width:calc(100%-50px); 经过查询官网原来发现这里有个需要注意的地方就是在进行加减运算的时候,必须在运算符 ...

  5. CSS3中动画属性transform、transition 和 animation

    CSS3中和动画有关的属性有三个 transform.transition 和 animation.下面来一一说明:        transform   从字面来看transform的释义为改变,使 ...

  6. css3中的布局相关样式

    web页面中的布局是指在页面中如何对标题.导航栏.主要内容.脚注.表单等各种构成要素进行合理编辑.在css3之前,主要使用float属性或position属性进行页面中的简单布局,但是也存在一些缺点, ...

  7. css3中的制作动画小总结

    系列教程 CSS3属性中有关于制作动画的三个属性:Transform,Transition,Animation: Transform 在CSS3中transform主要包括以下几种:旋转rotate. ...

  8. 为什么CSS中的calc函数可能会不生效？

    前言 在早期如果想要对某一些样式进行动态计算,绝大多数的做法都是使用JavaScript来进行,当时的CSS在面对这种场景显得有点无能为力.但是,当CSS3中新增了calc函数时,面对这种场景,Jav ...

  9. CSS3中的动画效果记录

    今天要记录的是CSS3中的三种属性transform.transition以及animation,这三个属性大大提升了css处理动画的能力. 一.Transform 变形 CSS中transform ...

随机推荐

  1. uiautomatorviewer

    uiautomatorviewer路径 /usr/local/Caskroom/android-platform-tools/29.0.1/tools/bin

  2. dedecms手机站和PC站共用同一数据库的方法

    我们知道搜索引擎建议将手机站和PC站分开,虽然自适应可以适配不同的终端,但单独建独立的m站可能权重和排名更好,因为移动端的竞争度不同甚至更低.代码更精简.蜘蛛抓取更顺畅,所以要单独建手机站比较好.那么 ...

  3. Git工具使用基础

    Git 是一个分布式的版本控制工具,本篇文章从介绍Git开始,重点在于介绍Git的基本命令和使用技巧,让你尝试使用Git的同时,体验到原来一个版 本控制工具可以对开发产生如此之多的影响,文章分为两部分 ...

  4. Linux中一些命令的区别

    1. yum provides 和 yum search provides是在文件中查找软件,类似于rpm -qf: search是查找软件包或其描述的关键字. 2. gzip  和  bzip2 对 ...

  5. Windbg Watch(监视)窗口的使用

    在WinDbg中,可以使用“监视”窗口显示和更改全局和局部变量和寄存器信息. 您可以自定义此窗口以显示您正在跟踪的项..“监视”窗口可以显示所需的任何变量列表.这些变量可以包括来自任何函数的全局变量和 ...

  6. js中的new操作符解析

    new 操作符做了以下事情: 1.创建一个对象,将对象赋值给this function Person(name, age) { console.log(this) //Person {} } let ...

  7. 全球 IPv4 地址正式耗尽

    重要消息: 就在 2019/11/25 UTC+1 15:35 时,一封来自欧洲 RIPE NCC 的邮件中得到确认:全球的IPv4地址已经彻底耗尽. IPv4 大家应该很熟悉了,就是我们平常所知道的 ...

  8. JavaScript如何实现日期的前一天后一天转变

    1.生成时间 var data =new Date(); 2.获得时间戳     什么是时间戳? 时间戳是指格林威治时间自1970年1月1日(00:00:00 GTM)至当前时间的总秒数.它也被称为U ...

  9. ArcGIS Server浏览地图服务无响应原因分析说明

    1.问题描述 从4月17号下午5时起,至18号晚9点,客户单位部分通过ArcGIS Server发布的地图服务(该部分地图服务的数据源为数据库SJZX)无法加载浏览,表现为长时间无响应.同时,通过Ar ...

  10. python面试题300多题

    第一部分 Python基础篇(80题) 为什么学习Python? 通过什么途径学习的Python? Python和Java.PHP.C.C#.C++等其他语言的对比? 简述解释型和编译型编程语言? P ...