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

.container{

  height: calc(100% - 40px);  //注：减号前后要有空格，否则很可能不生效！！

}

height:calc(100% - 40px)的更多相关文章

  1. 微信小程序 - height: calc(xx - xx)；无效

    遇到一个小问题,记录一下 问题:在微信小程序中使用scroll-view标签时,用height:cale(xx - xx)设置高度无效,在page中设置高度为百分百依旧无效 解决办法:直接在父级vie ...

  2. height为100%的问题

    问题描述 很多同学,对于设置div 的高度为100%时,有疑惑. 设置div 的高度为100%,意思是此 div 的高度 铺满父元素. 那么 怎么使 div 铺满浏览器屏幕? 代码 <!DOCT ...

  3. width: calc(100% - 20px);

    width: calc(100% - 20px); css3 的 calc()函数.这里的意思是设置宽度比100%的宽度少20px. calc()函数用于动态计算长度值. calc()函数支持 &qu ...

  4. 解决html设置height：100%无效的问题

    通常我们需要让自己的网页内容能够更好的适配各种屏幕大小,会采用height:100%,但是我们发现问题出来了,height:100%无效,其实解决办法很简单 解决:你只需要在css处添加上html, ...

  5. 在 Less 中使用 calc() 的坑：height: calc(~"50% - 21px");

    注意点: 中间的运算符两头都要有空格 写法(加上~符号):height: calc(~"50% - 21px"); 出处:https://mp.weixin.qq.com/s/CY ...

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

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

  7. css中 出现height为100%失效的原因及解决方案

    我们都知道需要给html和body标签设置了高度height:100%之后,再给内部的div设置height:100%的时候,内部div的高度100%才会起到作用.这是由于:%是一个相对父元素计算得来 ...

  8. CSS设置height为100%无效的情况

    CSS设置height为100%无效的情况 笔者是小白,不是特别懂前端.今天写一个静态的HTML页面,然后想要一个div占据页面的100%,但是尝试了很多办法都没有实现,不知道什么原因. 后来取百度搜 ...

  9. 背景图height：100%显示

    这段时间,写移动端页面,总是遇到背景图在不同的设备上的显示拉伸问题: 本来想写百分比,可是并没有显示,又不想media@ ,换一种思路用img写 群友提供了一个办 html,body{height:1 ...

随机推荐

  1. mysql string types ---- mysql 字符类型详解

    一.mysql 中包涵的字符类型: [national] char [(m)] [character set charset_name] [collate collation_name] [natio ...

  2. unity, EventType.MouseUp注意事项

    如果鼠标移出了窗口范围,则即使鼠标抬起也不会收到EventType.MouseUp消息,所以只写 if(event==EventType.MouseUp){ 执行某操作 } 是错误的,会导致非常奇怪的 ...

  3. RPC服务框架dubbo(四)：Dubbo中Provider搭建

    1.新建Maven Project, 里面只有接口(dubbo-service) 1.1 为什么这么做? RPC框架,不希望Consumer知道具体实现.如果实现类和接口在同一个项目中,Consume ...

  4. 安装wxWidgets遭遇的两大关卡

    早就想体验wxWidgets.这学期的C++课,课时还算充裕.关键是弟子们的实践能跟得上,我希望能让他们也浅尝一把GUI开发. MFC能够选.但既然IDE都用CodeBlocks了.还是选wxWidg ...

  5. 总结iOS9中的新的方法

    iOS平台在快速的发展,各种接口正在不断的更新.随着iOS9的发布,又有一批老方法不推荐使用了,你若调用这些方法,运行的结果是没有问题的,但是会出现警告“***is deprecated :first ...

  6. Ubuntu/Debian交叉编译安装ARM平台版本的ffmpeg

    1 准备工作 (1)libmp3lame库 下载:    wget http://downloads.sourceforge.net/lame/lame-3.99.tar.gz 解压 编译:./con ...

  7. C语言 · 数对

    算法训练 数对   时间限制:1.0s   内存限制:512.0MB      问题描述 编写一个程序,该程序从用户读入一个整数,然后列出所有的数对,每个数对的乘积即为该数. 输入格式:输入只有一行, ...

  8. 使用导出导入(datapump)方式将普通表切换为分区表

    随着数据库数据量的不断增长,有些表须要由普通的堆表转换为分区表的模式. 有几种不同的方法来对此进行操作,诸如导出表数据,然后创建分区表再导入数据到分区表:使用EXCHANGE PARTITION方式来 ...

  9. 面向对象设计原则二：开闭原则（OCP）

    开闭原则(OCP)定义:对扩展开发,对修改关闭.好处:      适应性和灵活性.      稳定性和延续性.      可复用性与可维护性. 解释说明:开闭原则指的是两方面:对功能扩展开发,对修改进 ...

  10. javascript不可用的问题探究

    昨天在Twitter上的一些有趣的讨论中, 我发现人们对于Web应用和站点对javascript的依赖普遍存在一种疑惑. 这种疑惑一直都存在, 而对我而言, 这个问题随着浏览技术的飞跃发展而集中爆发了 ...