2019-07-05 CSSの各パーセンテージ値はどの計算に対してですか?
1022 ワード
CSSの各パーセンテージ値はどの計算に対してですか?
たとえば、サブエレメントwidth:50%を設定します.
.son{
width:50%;
}
.son
widthは親要素に対するcontent領域の幅値計算heightは親要素に対するcontent領域の高さ値計算padding-left,padding-right,padding-top,padding-bottomは親要素に対するcontent領域の幅値計算margin-left,margin-right,margin-top,margin-bottomは親要素に対するcontent領域の幅値計算
position:absoluteの要素の場合、計算値にはサブ要素left:50%の設定など、特別なものがあります.
.son{
position:absolute;
left:50%;
}
.sonのleft値またはright値は、ブロックを含む幅に対して計算されるtop値またはbottom値は、ブロックを含む高さに対して計算される
position:relativeの要素の場合、計算値と幅の高い計算規則は同じです.たとえば、サブ要素left:50%を設定します.
.son{
position:relative;
left:50%;
}
left値またはright値は、親要素の幅に対して計算されるtop値またはbottom値が親要素の高さに対して計算される
.son{
width:50%;
}
.son{
position:absolute;
left:50%;
}
.son{
position:relative;
left:50%;
}