CSS 尺寸的百分比

CSS中的单位

绝对单位

in-英寸；

cm;

mm;

pt-磅

相对单位

em-与元素字号挂钩；

rem-与根元素字号挂钩；

px-与css像素挂钩

%-另一属性值的百分比

CSS中可以取百分比的属性

定位：top, right, bottom, left

盒模型：width,height, margin,padding

背景：backgroug-position, backgroud-size

文本：text-indent

字体：font-size

百分比是怎样运算的

百分比的运算是相对一个基数的，这个基数与当前元素的包括块有关。

基于包括块的宽度来运算的属性：margin, padding, width, max-width,min-width, left, right, text-indent.

基于包括块的高度来运算的属性：top，bottom，height，max-height，min-height

基于当前字体大小来运算的属性：line-height

基于line-height来运算的属性：vertical-align

基于元素本身的宽高：background-position：背景图像的位置，离别设定水平标的目的和垂直标的目的上的两个值，假如使用百分比，那么百分比值会同时利用于元素和图像。例如 50% 50% 会把图片的（50%, 50%）这一点与框的（50%, 50%）处对齐，相当于设定了 center center。同理 0% 0% 相当于 left top，100% 100% 相当于 right bottom

基于元素本身的宽度：background-size但此值只能利用在块元素上，所设定百分值将使用背景图片大小按照所在元素的宽度的百分比来运算

引荐教程：《CSS教程》

以上就是CSS 尺寸的百分比的具体内容，更多请关注百分百源码网其它相关文章！