gpt4 book ai didi

html - 'em' css 单元如何用于定位元素?

转载 作者:太空宇宙 更新时间:2023-11-03 21:18:49 25 4
gpt4 key购买 nike

下面是嵌套了div的html代码和一个 p作为最内层的元素,

<!DOCTYPE html>
<html>
<head>
<title>How em unit works?</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div>
<div>
<p> Some text</p>
</div>
</div>
</body>
</html>

如果样式为,

body{
font-size: 10px; /* Default font size is 16 css pixels for body tag*/
}

body > div{
font-size: 20px;

}

body > div > div{
font-size: 50px;
}

p{
font-size: 0.5em; /* 25 css pixels */
width: 6em; /* 6X50 css pixels */
height: 6em; /* 6X50 css pixels */
padding-right: 3em; /* 3X50 css pixels */
margin-left: 3em; /* 3X50 css pixels */
background-color: red;
}

然后,段落文本,取 font-size作为0.5 x 50px (最近 parent 的 0.5 倍 font-size )。

我的问题,

body{
font-size: 10px; /* Default font size is 16 css pixels for body tag*/
}

body > div{
font-size: 20px;
position: relative;

}

body > div > div{
font-size: 50px;
}

p{
font-size: 0.5em;
width: 6em;
height: 6em;
padding-right: 3em;
margin-left: 3em;
background-color: red;
position: absolute;
}

如果p得到 position: absolute和最外层 div成为position: relative ,那么,em 是如何实现的? p 的单元行为更改元素?

最佳答案

How does the em unit behavior change, if p is position: absolute?

根本没有变化。

父元素还是父元素。

关于html - 'em' css 单元如何用于定位元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39399123/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com