龙空技术网

html中百分比单位的总结

恒星网络 405

前言:

今天你们对“css3百分比”大约比较注意,我们都想要分析一些“css3百分比”的相关资讯。那么小编在网上网罗了一些关于“css3百分比””的相关文章,希望咱们能喜欢,朋友们一起来学习一下吧!

实际开发中,喜欢用百分比但是发现自己对百分比掌握的不够,经常会出现一些出乎意料的效果,今天整理了CSS中有关百分比单位知识,如果对你有帮助的话请多多支持下小编哈!

效果:

要想理解百分比这样的相对单位,首先要做的事就是找到某个元素的参照物,比如绝对定位的位置参照是已有定位(相对于 static 定位以外的第一个父元素进行定位),下面我们通过参考物的分类来详细说明css中的百分比应用。

1.相对于参考物宽度的:A.[max/min-]widthB.paddingC.marginD.left(有定位情况)E.right(有定位情况)

效果:

写这个例子的时候突然想试试border能不能用百分比,意料之中,不行。这里的.son元素的参考物是.parent1,而不是离她最近的.parent2。

标签: #css3百分比