html css相对单位

p{
background:grey;
color:white;
font-size:0.5in;
height:2em;
width:50%;
}
height:2em意思就是屏幕上显示的的高度为字号的2倍
font-size:0.5in;就是html的字号设置为0.5英寸,是绝对值
width:50% 宽度为浏览器的0.5

css相对长度也可以更为灵活的使用,比如width:calc(80% - 20px);
css角度的使用
.image_test_1, .image_test_5 {
-moz-transform: rotate(-5deg);
-webkit-transform: rotate(-5deg);
-o-transform: rotate(-5deg);
transform: rotate(-5deg);
/*
-o-transform: /* Opera浏览器 */
-webkit-transform: /* Webkit内核浏览器 */
-moz-transform: /* Firefox浏览器 */
*/
}
html css相对单位的更多相关文章
- css大小单位px em rem的转换和详解
css大小单位px em rem的转换和详解 PX特点1. IE无法调整那些使用px作为单位的字体大小:2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位:3. Firefox能 ...
- CSS的单位及css3的calc()及line-height百分比
锚点:css中百分比减去固定元素 单位介绍 说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着 ...
- 移动H5开发入门知识,CSS的单位汇总与用法
说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid a ...
- H5移动端开发入门知识以及CSS的单位汇总与用法
说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid a ...
- 2.css字体单位
这期简单说说css字体单位 字体单位有三种:px.em.rem 任意浏览器的默认字体高都是16px.所有未经调整的浏览器都符合: 1em=16px. % 百分比 in 英寸 cm 厘米 mm 毫米 e ...
- css常用单位
css常用单位 本文来简单介绍下css的常用单位. 绝对长度单位 绝对长度单位代表一个物理测量. 像素px(pixels) 在web上,像素px是典型的度量单位,很多其他长度单位直接映射成像素.最终, ...
- vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em,rem的区别
移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...
- css中单位em和rem的区别
在css中单位长度用的最多的是px.em.rem,这三个的区别是: px是固定的像素,一旦设置了就无法因为适应页面大小而改变. em和rem相对于px更具有灵活性,他们是相对长度单位,意思是长度不是定 ...
- CSS的单位 及 css3的calc() 及 line-height 百分比
CSS的单位及css3的calc()及line-height百分比 摘自:http://www.haorooms.com/post/css_unit_calc 单位介绍 说到css的单位,大家应该首先 ...
- css之单位
css之单位 角度<angle> 用于<gradient>s和某些transform功能中 deg表示以度为单位的角度.一整圈就是360deg. 例如:0deg,90deg,1 ...
随机推荐
- icon的使用
在前端页面设计时,不免使用的就是图标,下面就我使用图标icon分享一下经验 1.icon插件,现在比较好的是bootstrap自带的,fontawesome,链接地址:http://fontaweso ...
- c# windows服务 一个项目安装多个服务
创建windows服务就不讲解了,其它大神写太多了.这里只写一个项目安装多个服务的教程.如:http://www.cnblogs.com/zzgblog/p/4595839.html 首先按下图创建多 ...
- css3 div垂直居中
css3: #dd{ height: 300px; background: #0000cc; display: -webkit-box; display: flex; display: -webkit ...
- js--事件对象的理解1
在触发DOM上的某个事件时,会产生一个事件对象event.这个对象中包含着所有与事件有关的信息.包括导致事件的元素,事件的类型以及其他与特定事件相关的信息. 举例鼠标操作导致的事件对象中,会包含鼠标位 ...
- [妙味JS基础]第四课:JS数据类型、类型转换
知识点总结 JS数据类型:number数字(NaN).string字符串.boolean布尔值.函数类型.object对象(obj.[].{}.null).undefined未定义 typeof 用来 ...
- LINQ里的“equals”和“==”的区别
对于值类型,如果对象的值相等,则相等运算符 (==) 返回 true,否则返回 false.对于string 以外的引用类型,如果两个对象引用同一个对象,则 == 返回 true.对于 string ...
- Intellij Idea web项目的部署配置[转]
原文地址:http://blog.csdn.net/z69183787/article/details/41416189 1.前言 2.项目配置(Project Structure) 2.1 Proj ...
- Java JVM 类的连接与初始化 [ 转载 ]
Java类的连接与初始化 (及2013阿里初始化笔试题解析) 转自http://www.cnblogs.com/iceAeterNa/p/4876747.html Java虚拟机通过 ...
- OMCS开发手册(03) -- 多媒体服务器
前面我们已经详细介绍了基于OMCS开发网络多媒体应用的客户端程序所必需掌握的内容,现在我们来看一下OMCS服务端的开发.对于使用者而言,OMCS的服务端就非常简单了,只要实现一个用户验证的接口,挂接到 ...
- C++中构造函数或析构函数定义为private
转自:http://www.blogjava.net/fhtdy2004/archive/2009/05/30/278971.html 很多情况下要求当前的程序中只有一个object.例如一个程序只有 ...