Viewport-Percentage (or Viewport-Relative) Lengths

Viewport-Percentage Lengths：

The viewport-percentage lengths are relative to the size of the initial containing block. When the height or width of the initial containing block is changed, they are scaled accordingly.

  • vh 　　(viewport height)
  • vw 　　(viewport width)
  • vmin 　　(viewport minimum length)
  • vmax 　　(viewport maximum length)

What exactly is vmin and vmax?

  • 1vmin assumes a value of the smallest between 1vh and 1vw.
  • 1vmax assumes a value of the largest between 1vh and 1vw.

FROM stackoverflow

Make div 100% height of browser window/设置div等于浏览器的高度的更多相关文章

  1. 【CSS系列】height:100%设置div的高度

    一.div设置百分百高度实现描述 在html布局中body内第一个div盒子对象设置100%高度height样式,是无法成功显示100%高度的.这个是因为body高度默认值为自适应的,所以及时设置bo ...

  2. 如何让div中的span垂直居中 ----height:100%设置div的高度

    如果div中只有一个span一个元素,可以使用line-height.如果div中还有其他元素,可以设置span的css如下: .span{ position: absolute; top: 50%; ...

  3. 如何设置div的宽度为100%-xx px？

    如何设置div的宽度为100%-xx px? 参见如下帖子:http://stackoverflow.com/questions/15183069/div-width-100-10px-relativ ...

  4. Div内有ul li元素，Div设置高度100%，谷歌IE下li过多会显示滚动条，而火狐下就会滚动条就不起作用，li会撑大Div

    产品上也许是用了过多iframe问题,自己做了demo没有这种情况 解决办法: 设置Div的display样式为-moz-inline-grid -moz-代表火狐私有属性,使用自己的div样式就可以 ...

  5. jQuery设置div的自适应布局

    一.HTML代码: <div class="ui-wraper" id="Wraper"> </div> 二.CSS代码: html { ...

  6. 【转】CSS设置DIV背景色渐变显示

     [原链接]http://www.2cto.com/kf/201310/248187.html <style type="text/css">     .linear{ ...

  7. CSS中设置DIV垂直居中的N种方法 兼容IE浏览器

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  8. CSS设置DIV背景色渐变显示

    本文转载自:http://blog.csdn.net/gingerredjade/article/details/12191741 <style type="text/css" ...

  9. 设置DIV根据内容自动调整高度的三个方法

    Div即父容器在Firefox.Chrome.Safari中不会根据内容自动调节高度,我们看下面的HTML代码: <divid="main"><divid=&qu ...

随机推荐

  1. Spark cache 和 persist

    1)RDD的cache()方法其实调用的就是persist方法,缓存策略均为MEMORY_ONLY:2)可以通过persist方法手工设定StorageLevel来满足工程需要的存储级别:3)cach ...

  2. [转载]CRect::DeflateRect

    1基本内容 void DeflateRect(int x,int y); void DeflateRect(SIZE size); void DeflateRect(LPCRECT lpRect); ...

  3. CSS Bugs 解决方案

    说明:本文档兼容性测试基础环境为:windows系统:IE6-IE10, Firefox6.0, Chrome13.0, Safari5.1, Opera11.51 Bugs及解决方案列表(以下实例默 ...

  4. bzoj4457: 游戏任务--双层01背包

    这题和NOIP的金明的预算方案(?)很像,只不过附件的数量增多了 如果对主件进行一次01背包,再套一层附件的01背包O(n4)肯定会爆.. 所以我们可以先预处理出,对于每个主件,花的时间为k的情况下, ...

  5. php数组序列化serialize与unserialize

    $arr=array('1','2','3');echo serialize($arr); //序列化 a:3:{i:0;s:1:"1";i:1;s:1:"2" ...

  6. php课程---练习（发布新闻）

    做一个发布新闻的页面,实现发布新闻,查看新闻,修改新闻与删除等功能 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...

  7. Oracle 11g的Redo Log和Archive Log的分析方法

    自Oracle 11g起,无需设置UTL_FILE_DIR就可以使用LOGMNR对本地数据库的日志进行分析,以下是使用LOGMNR的DICT_FROM_ONLINE_CATALOG分析REDO和归档日 ...

  8. str_replace() 用法bug和技巧

    语法 str_replace(find,replace,string,count) 参数 描述 find 必需.规定要查找的值. replace 必需.规定替换 find 中的值的值. string ...

  9. SharedPreferences第一次使用后HashMap将常驻内存

    今天使用SharedPreferences的时候突然想到了这个问题,因为我们要存储应用级别的上下文信息,包括用户信息等一系列信息:这个时候使用getSharedPreferences是否合适呢! 其实 ...

  10. Wordpress 标题设置

    使用标题格式:首页(网站标题 - 网站副标题),其他页面(页面标题 | 网站标题) 在后台找到头部文件head.php <?php wp_title('|', true, 'right'); e ...