锐客网

  1. 首页 > 生活百科 > >

css百分数值介绍

生活百科

百分数值的表现方式更为复杂 。假设你希望用百分数值将图像在其元素中居中，这很容易：
百分数值百分数值的表现方式更为复杂 。假设你希望用百分数值将图像在其元素中居中，这很容易：
body{background-image:url(/i/eg_bg_03.gif);background-repeat:no-repeat;background-position:50% 50%;}【css百分数值介绍】这会导致图像适当放置，其中心与其元素的中心对齐 。换句话说，百分数值同时应用于元素和图像 。也就是说，图像中描述为 50% 50% 的点（中心点）与元素中描述为 50% 50% 的点（中心点）对齐 。
如果图像位于 0% 0%，其左上角将放在元素内边距区的左上角 。如果图像位置是 100% 100%，会使图像的右下角放在右边距的右下角 。
因此，如果你想把一个图像放在水平方向 2/3、垂直方向 1/3 处，可以这样声明：
body{background-image:url(/i/eg_bg_03.gif);background-repeat:no-repeat;background-position:66% 33%;}如果只提供一个百分数值，所提供的这个值将用作水平值，垂直值将假设为 50% 。这一点与关键字类似 。
background-position 的默认值是 0% 0%，在功能上相当于 top left 。这就解释了背景图像为什么总是从元素内边距区的左上角开始平铺，除非您设置了不同的位置值 。


以上就是css百分数值介绍，希望大家喜欢，请继续关注我们 。

    推荐阅读


    上一篇：苹果13是六核还是八核

    下一篇：店铺小飞虫怎么处理