css中的em单位怎么用

小编给大家分享一下css中的em单位怎么用,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!

我们提供的服务有:成都网站设计、成都网站建设、微信公众号开发、网站优化、网站认证、奉贤ssl等。为千余家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的奉贤网站制作公司

    css长度单位之em单位

    em是相对字体长度单位,它的单位长度是根据元素的文本文字垂直长度来决定的。例:1em相当于当前的字体尺寸(font-size属性),那么2em相当于当前字体尺寸的2倍。若用于其他属性(width,height),则是相对于本身元素的font-size。可以作用在width、height、line-height、margin、padding、border等样式的设置上。

    我们具体的看一个简单的示例,来了解em。

    <!DOCTYPEhtml>

    <html>

    <head>

    <metacharset="UTF-8">

    <style>

    div{

    font-size:40px;

    width:10em;

    /*400px*/

    height:10em;

    border:solid1pxblack;

    }

    p{

    font-size:0.5em;

    /*20px*/

    width:10em;

    /*200px*/

    height:10em;

    border:solid1pxred;

    }

    span{

    font-size:0.5em;

    width:10em;

    height:10em;

    border:solid1pxblue;

    display:block;

    }

    </style>

    </head>

    <body>

    <div>

    我是父元素div

    <p>

    我是子元素p

    <span>我是孙元素span</span>

    </p>

    </div>

    </body>

    </body>

    </html>



css中的em单位怎么用

看完了这篇文章,相信你对“css中的em单位怎么用”有了一定的了解,如果想了解更多相关知识,欢迎关注创新互联行业资讯频道,感谢各位的阅读!

标题名称:css中的em单位怎么用
本文路径:https://www.cdcxhl.com/article46/ppjheg.html

成都网站建设公司_创新互联,为您提供响应式网站手机网站建设App设计软件开发云服务器域名注册

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

成都网站建设公司