在移动端开发的过程中，常常会遇到头部高度是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. hive partition 分区使用

    一.背景 1.在Hive Select查询中一般会扫描整个表内容,会消耗很多时间做没必要的工作.有时候只需要扫描表中关心的一部分数据,因此建表时引入了partition概念. 2.分区表指的是在创建表 ...

  2. CMD查看进程ID并查杀进程

    开始-运行,输入CMD打开命令行界面,输入命令netstat -ano 结束该进程C:\>taskkill /f /t /im Wiz.exe 根据进程ID杀 >taskkill /F / ...

  3. unity, undo

    如果在操作一个Object之前调用Undo.RecordObject(Object),且操作确实造成Object某些属性的改变,则会产生一个undo记录. 如果我们的架构不是直接操作Object,而是 ...

  4. Javascript Event事件-总结

    一.事件类型 例如:mouseover鼠标移动到.keydown键盘按下 二.事件目标 是发生的事件或与之相关的对象,window.document和Element对象是最常见的事件目标 三.事件对象 ...

  5. vim中不同模式的帮助信息的查找

    vim的模式有多种,比如normal(普通模式),insert(插入模式),command(命令行模式),visual(可视化模式).相同的命令和快捷键在不同的模式下功能是不一样的,因此帮助信息也是分 ...

  6. 计算机图形学（一） 视频显示设备_1_CRT原理

    第 1 章 图形系统概述        如今.计算机图形学的作用与应用已经得到了广泛承认.大量的图形硬件和软件系统已经应用 到了差点儿全部的领域.通用计算机甚至很多手持计算器也已经普遍具备 二维及三维 ...

  7. stl遍历map

    MapInfo* CGameConfig::getMapInfoById( int nId ) { for (map<int, MapInfo>::iterator it = m_mapM ...

  8. Eclipse 最有用的快捷键

    Eclipse中10个最有用的快捷键组合  一个Eclipse骨灰级开发者总结了他认为最有用但又不太为人所知的快捷键组合.通过这些组合可以更加容易的浏览源代码,使得整体的开发效率和质量得到提升.    ...

  9. Django--缓存、信号、序列化

    一 Django的缓存机制 1.1 缓存介绍 1.缓存的简介 在动态网站中,用户所有的请求,服务器都会去数据库中进行相应的增,删,查,改,渲染模板,执行业务逻辑,最后生成用户看到的页面. 当一个网站的 ...

  10. 认识rem

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...