美文网首页
html常用单位与js获取方法、

html常用单位与js获取方法、

作者: Amuer蘃 | 来源:发表于2019-11-03 19:01 被阅读0次

    px:绝对单位,页面按精确像素展示
    em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值。
    rem:相对单位,可理解为”root em”, 相对根节点html的字体大小来计算。
    (另外需注意chrome强制最小字体为12号,即使设置成 10px 最终都会显示成 12px,当把html的font-size设置成10px,子节点rem的计算还是以12px为基准。)
    vw:viewpoint width,视窗宽度,1vw等于视窗宽度的1%。
    vh:viewpoint height,视窗高度,1vh等于视窗高度的1%。(100vh为全屏)
    vmin:vw和vh中较小的那个。
    vmax:vw和vh中较大的那个。
    window对象指包含浏览器一起的
    Docunment对象是Window对象的一部分(浏览器内容部分)
    window.innerHeight,window.innerWidth(整个浏览器宽高)
    window.outerHeight,window.outerWidth(除去浏览器头部栏目等宽高,但包含控制台)
    window.screen 对象包含有关用户屏幕的信息
    window.screen.heigth 屏幕高度
    window.screen.width
    window.screen.availHeight 屏幕可以利用的高度
    window.screen.availWidth
    window.screenTop 浏览器离屏幕的距离
    window.screenLeft
    innerHeight 浏览器可用的高度(兼容IE9以上,不包含控制台)
    innerWidth
    outerHeight 整个浏览器的高度(包含浏览器栏目,控制台等)
    outerWidht

    与client相关的宽高

    document.body.clientWidth 该属性指的是元素的可视部分宽度和高度,即padding+content(如果没有滚动条,即为元素设定高宽)
    document.body.clientHeight (如果出现滚动条,滚动条会遮盖元素的宽高,那么该属性就是其本来宽高减去滚动条的宽高)```

    相关文章

      网友评论

          本文标题:html常用单位与js获取方法、

          本文链接:https://www.haomeiwen.com/subject/gldlbctx.html