如果有固定头部高度和底部高度，内容的高度或者宽度想要根据浏览器屏幕自适应的话，可以用到css3的计算属性,即calc。

用法如下：

内容区域高/宽 = calc(100% - 头部高宽 - 底部高宽)

//这样就可以自适应高度或宽度了。

浏览器高度： document.documentElement.clientHeight

css3计算属性(calc)的更多相关文章

  1. css3中样式计算属性calc()的使用和总结

    calc的介绍 在css3样式中有一个类似与函数的计算属性calc(),它主要用于指定元素的长度,无论是border.margin.pading.font-size和width等属性都可以使用calc ...

  2. css计算属性 calc()

    left: calc((100vw - 400px) / 2);   calc 进行简单的运算时,运算符号左右各要有一个空格,不然不起作用.

  3. css 计算属性 calc的使用

    宽度等于父元素的宽度减去16像素 高度等于父元素的高度减去16像素 注意:100%和16px   与减号之间必须有空格,否则高度会失效!!!! .box{ width:calc(100% - 16px ...

  4. CSS中新属性calc()

    CSS3的calc()使用 原文: http://www.w3cplus.com/css3/how-to-use-css3-calc-function.html © w3cplus.com calc( ...

  5. 纯CSS实现自动轮播，CSS变量的定义与使用，计算属性的使用

    先来看一下实现的效果: 实现原理: HTML中使用ul>li存放图片 CSS使用CSS3的animation来完成动画 <!-- HTML --> <section class ...

  6. css中新增的属性calc()可以计算使用

    什么是calc: calc是英文单词calculate(计算)的缩写,是css3的一个新增的功能,用来指定元素的长度.可以使用calc()给元素的border.margin.pading.font-s ...

  7. css3 animation 属性众妙

    转自:凹凸实验室(https://aotu.io/notes/2016/11/28/css3-animation-properties/) 本文不会详细介绍每个 css3 animation 属性(需 ...

  8. web 开发：CSS3 常用属性——速查手册！

    web 开发:CSS3 常用属性——速查手册! CSS3 简介:http://www.runoob.com/css3/css3-intro.html 1.目录 http://caniuse.com/ ...

  9. CSS3基础(4)——CSS3 渲染属性

    一. CSS3 计数器详解    CSS3计数器(CSS Counters)可以允许我们使用CSS对页面中的任意元素进行计数,实现类似于有序列表的功能. 与有序列表相比,它的突出特性在于可以对任意元素 ...

随机推荐

  1. Frotinet60D IP映射 開放指定端口是實際應用

    有多個外網IP的環境中,在某一部電腦上,如何使用多個外網IP中的某一個?且為使用的Bitcomet開放TCP,TUP特定端口? 1.在本機windows防火墻中"輸入" 和&quo ...

  2. mysql主从一致问题

    https://www.cnblogs.com/gomysql/p/3662264.html

  3. CrtmpServer 接收推送视频流 注册流基本流程

    今天研究了CrtmpServer 将客户端推动过来的视频流注册到服务的流程,记录下来,以备后用. 图1 注册前端视频流流程

  4. C# SQL 整表插入

    说明: (1)表A的一部分数据插入到表B (2)DataAccess 类,是放在DAL层下的底层类; da.StrConnection 写在DataAccess类中; //整表插入方法 private ...

  5. 使用 Kingfisher 处理网络图片的读取与缓存

    Kingfisher 是一个读取网络图片和处理本地缓存的开源库,由 onevcat 开发.提到图片缓存库,那么熟悉 Objective-C 开发的同学,可能会想起 SDWebImage. 没错,Kin ...

  6. java对象访问

    下面这句代码: Object obj = new Object(); 对象引用在栈中,对象实体存在堆中,引用的方式有两种,分别是通过句柄访问对象和通过直接指针访问对象. Sun HotSpot使用第二 ...

  7. 基于Django做权限控制

    一.权限信息初始化 二.中间件操作 三.自定义标签 补充:数据表设计,源码下载,其它

  8. java模拟而一个电话本操作

    哈哈.大家平时都在使用电话本.以下使用java来模拟而一个简单的电话本吧... 首先给出联系人的抽象类 package net.itaem.po; /** * * 电话人的信息 * */ public ...

  9. iOS开发 - UIViewController控制器管理

    创建一个控制器 控制器常见的创建方式有下面几种 //通过storyboard创建 //直接创建 ViewController *vc = [[ViewController alloc] init]; ...

  10. sql server t-sql脚本转成oracle plsql

    将一份SQL SERVER数据库生成的T-SQL脚本,转成ORACLE的PL/SQL,其复杂繁琐程度,远远出乎我的意料. 这份SQL SERVER脚本,里面有表,有视图,还有存储过程,以及一些自定义函 ...