Question

在css中position:relative和padding有什么区别

Answer 1

padding是内边距，例：.demo{padding:10px}，这句会在所有使用demo这个类的元素的上、右、下、左分别添加一个10像素的内边距。position是用来设置元素位置的，如：position:relative，这个的意思是将元素的位置设置为相对。另外还有position:absolute，用来绝对定位元素。例如：.demo{position:absolute;top:10px;right:10px}，这句会让使用demo这个类的元素进行绝对定位，让这个元素离上边10像素，离右边10px，也就是会把元素定位在右上角的位置上。

追问

举个例子说明

Answer 2

完全不相干的两句代码

position是定位方式

padding是内边距

如果非要说关系的话

那么 position 的 relative 这个值是可以受 PADDING 或者 MARGIN 在或者 TOP LEFT 控制的

而 position:absolute 就只受 TOP LEFT 控制

也就是说 relative 是像默认流一样 但还可以用TOP来绝对定位

Answer 3

Vue实践-CSS样式position/display/float属性对比使用