如果 position 和 display 之间的值相互叠加，会产生不同的效果，取决于使用哪种属性值：
position: static和display: block或display: inline-block：元素将被认为是一个块级元素，并且将按照文档流的方式进行布局，忽略top、right、bottom 和 left 属性。position: static和display: inline：元素将被认为是一个行内元素，并且将按照文档流的方式进行布局，忽略top、right、bottom 和 left 属性。position: relative和display: block或display: inline-block：元素将被认为是一个块级元素，并且将相对于它在文档中的位置进行定位，但是将按照文档流的方式进行布局。position: relative和display: inline：元素将被认为是一个行内元素，并且将相对于它在文档中的位置进行定位，但是将按照文档流的方式进行布局。position: absolute和display: block或display: inline-block：元素将被认为是一个块级元素，并且将相对于它最近的定位祖先进行定位，如果没有定位祖先，则相对于<html>元素进行定位。position: absolute和display: inline：元素将被认为是一个行内元素，并且将相对于它最近的定位祖先进行定位，如果没有定位祖先，则相对于<html>元素进行定位。position: fixed：元素将相对于视口进行定位，不会随着窗口滚动而滚动。position: sticky：元素将在跨越特定阈值点时切换为fixed定位，并在阈值条件不满足时切换为relative定位。
如果加入了 overflow 或 float 属性，也会产生不同的效果：
overflow属性：设置了overflow属性的元素的内容会被裁剪，如果元素设置了position属性，那么元素的特定部分可能不可见。float属性：元素将浮动到文档流中，可以设置元素相对于其他元素的位置，但也可以导致其父元素高度塌陷。如果元素设置了position属性，则计算基于元素的偏移量可能发生变化。
如果 position 跟 float 同时使用，则元素将相对于浮动元素进行定位，但同时可能导致父元素高度塌陷。建议尽量避免同时使用 position 和 float 属性。