您现在的位置是:首页 > IT分类 > html+js网站首页html+jsCSS3常见及常用单位:总结
CSS3常见及常用单位:总结
- html+js
- 2020-03-12 13:35:24
简介常见的单位有: px:绝对单位,页面按精确像素展示 em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的
常见的单位有:
- px:绝对单位,页面按精确像素展示
- em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值。
- rem:相对单位,可理解为”root em”, 相对根节点html的字体大小来计算,CSS3新加属性,chrome/firefox/IE9+支持。
- vw:viewpoint width,视窗宽度,1vw等于视窗宽度的1%。
- vh:viewpoint height,视窗高度,1vh等于视窗高度的1%。
- %:百分比
常用的有:px、em、rem、%
- px是固定的像素,一旦设置了就无法因为适应页面大小而改变。
- em和rem相对于px更具有灵活性,他们是相对长度单位,意思是长度不是定死了的,更适用于响应式布局(其中%百分比也是一样)。
- 对于em和rem的区别一句话概括:em相对于父元素,rem相对于根元素。
- rem中的r意思是root(根源),这也就不难理解了。
浏览器的默认的font-size是16px,1rem默认就等于16px。(chrome最小字体为12px)
设置的font-size来改变rem尺寸:
html{
font-size: 20px
}
.box{
font-size: 1rem;
width:20rem;
height:10rem;
background-color:purple;
}
本文来源于袁志蒙
转载:
感谢您对蓝天个人博客网站平台的认可,非常欢迎各位朋友分享到个人站长或者朋友圈,但转载请说明文章出处“来源蓝天个人博客 http://www.along168.cn”。
上一篇:JS中数组相关方法:统计
下一篇:JS各种常用方法自定义函数
相关文章
文章评论
- html+js
- 2020-03-12 13:35:24
常见的单位有:
- px:绝对单位,页面按精确像素展示
- em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值。
- rem:相对单位,可理解为”root em”, 相对根节点html的字体大小来计算,CSS3新加属性,chrome/firefox/IE9+支持。
- vw:viewpoint width,视窗宽度,1vw等于视窗宽度的1%。
- vh:viewpoint height,视窗高度,1vh等于视窗高度的1%。
- %:百分比
常用的有:px、em、rem、%
- px是固定的像素,一旦设置了就无法因为适应页面大小而改变。
- em和rem相对于px更具有灵活性,他们是相对长度单位,意思是长度不是定死了的,更适用于响应式布局(其中%百分比也是一样)。
- 对于em和rem的区别一句话概括:em相对于父元素,rem相对于根元素。
- rem中的r意思是root(根源),这也就不难理解了。
设置的font-size来改变rem尺寸:
html{
font-size: 20px
}
.box{
font-size: 1rem;
width:20rem;
height:10rem;
background-color:purple;
}
本文来源于袁志蒙
转载: 感谢您对蓝天个人博客网站平台的认可,非常欢迎各位朋友分享到个人站长或者朋友圈,但转载请说明文章出处“来源蓝天个人博客 http://www.along168.cn”。
上一篇:JS中数组相关方法:统计
下一篇:JS各种常用方法自定义函数