css3新单位学习
vw,vh,vmin,vmax
vw 1vw = 视窗width*1%
vh 1vh = 视窗heihgt*1%
如果视窗的宽度小于高度,1vmin = 1vw,
如果视窗宽度大于高度,1vmin = 1vh
如果视窗的宽度大于高度,1vmax = 1vw,
如果视窗宽度小于高度,1vmax = 1vh 应用:比如视窗中垂直居中
兼容性比较
可以看出这些单位比较适合移动开发
css3新单位学习的更多相关文章
- CSS3 - 新单位vw、vh、vmin、vmax使用详解(附样例)
像 px.em 这样的长度单位大家肯定都很熟悉,前者为绝对单位,后者为相对单位.CSS3 又引入了新单位:vw.vh.vmin.vmax.下面对它们做个详细介绍. 一.基本说明 1,vw.vh.vmi ...
- css3新特性学习系列 -- border
css3新特性 border属性(border-radius.border-image.box-shadow)详解 1.border-radius 圆角 支持:IE9+ 用法: border-rad ...
- CSS3新单位vw、vh、vmin、vmax使用详解
像 px.em 这样的长度单位大家肯定都很熟悉,前者为绝对单位,后者为相对单位.CSS3 又引入了新单位:vw.vh.vmin.vmax.下面对它们做个详细介绍. 新单位也成为视窗单位,视窗(View ...
- CSS3新单位vw,vh,vmin,vmax详解
1,vw,vh,vmin,vmax是由视窗Viewport大小来决定的,单位1,代表1%,是一种相对单位,只要是为响应式适配视窗的一种解决方案: vw:view width(视窗宽度)的百分比,1vw ...
- css3新单位vw、vh的使用详解
响应式布局的单位我们第一时间会想到通过rem单位来实现适配,但是它还需要内嵌一段脚本去动态计算跟元素大小. 比如: (function (doc, win) { let docEl = doc.doc ...
- css3新单位vw、vh、vmin、vmax的使用介绍
1,vw.vh.vmin.vmax 的含义 (1)vw.vh.vmin.vmax 是一种视窗单位,也是相对单位.它相对的不是父节点或者页面的根节点.而是由视窗(Viewport)大小来决定的,单位 1 ...
- CSS3新特性学习
1.一些实用规范:盒子模型,列表模块,超链接方式,语言模块,背景和边框,文字特效,多栏布局: 2:新增的选择器selctor eg: 1) 子元素过滤伪类:div:first-child (自动识别 ...
- css3新单位vw、vh、vmin、vmax的使用详解(转载)
文章传送门: https://blog.csdn.net/ZNYSYS520/article/details/76053961
- CSS3 - 新单位vw、vh、vmin、vmax使用详解
参考文章出自:https://www.hangge.com/blog/cache/detail_1715.html
随机推荐
- 史上最详细git教程
题外话 虽然这个标题很惊悚,不过还是把你骗进来了,哈哈-各位看官不要着急,耐心往下看 Git是什么 Git是目前世界上最先进的分布式版本控制系统. SVN与Git的最主要的区别 SVN是集中式版本控制 ...
- 使用RequireJS并实现一个自己的模块加载器 (一)
RequireJS & SeaJS 在 模块化开发 开发以前,都是直接在页面上引入 script 标签来引用脚本的,当项目变得比较复杂,就会带来很多问题. JS项目中的依赖只有通过引入JS的顺 ...
- beans.xml
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...
- cesium核心类Viewer简介
1.简单描述Viewer Viewer类是cesium的核心类,是地图可视化展示的主窗口,cesium程序应用的切入口,扮演必不可少的核心角色. 官网的英文解析如下: A base widget fo ...
- ionic第一坑——ion-slide-box坑(ion-slide分两页的坑)
ionic.views.Slider = ionic.views.View.inherit({ initialize: function (options) { . . . function setu ...
- linux-centos在VM中的网络配置
1.自动获取IP地址 虚拟机使用桥接模式,相当于连接到物理机的网络里,物理机网络有DHCP服务器自动分配IP地址. #dhclient 自动获取ip地址命令 #ifconfig 查询系统里网卡信息,i ...
- D3.js学习(六)
上节我们学习了如何绘制多条曲线, 以及给不同的曲线指定不同的坐标系.在这节当中,我们会对坐标轴标签相关的处理进行学习.首先,我们来想一个问题, 如何我们的x轴上的各个标签的距离比较近,但是标签名又比较 ...
- 我的MYSQL学习心得(十三) 权限管理
我的MYSQL学习心得(十三) 权限管理 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) ...
- 如玫瑰一般的PHP与C#混合编程
故事背景是这样的,有一套项目,服务器端是用C#写的,为了完成某种事情,它需要使用到一个组件,这个组件很小但很重要,很不巧的是,这个这个组件是用PHP语言写的,如果为了使用这个组件而专门搭建一个PHP的 ...
- [译]DbContext API中使用SqlQuery和ExecuteSqlCommand获取存储过程的输入输出参数
水平有限,欢迎指正.原文:http://blogs.msdn.com/b/diego/archive/2012/01/10/how-to-execute-stored-procedures-sqlqu ...