营销型网站制作价格_Position：absolute属性定位居中

　　在web前端的日常工作中，经常会遇到设计师设计稿上不同模块重叠显示的需求。而微信小程序做直播要将两个不同模块重叠显示通常是通过CSS中的position属性来设置小程序设计的。

　　Position可取的值有 absolute、fixed、relative、static、inherit这些，具体说明可见下表：

　　【营销网站建设系统】

　　前不久我在运用html+css来实现设计稿的前端效果工作中遇到了一个模块上下左右居中的问题，最开始看到的这块内容的时候，首先想到的是运用position:absolute;属性来定位，虽然最终是成功实现了模块上下左右居中的效果，但是过程却有些波折。

　　举个例子，要实现下图的上下左右居中：

　　如果是正常来说，基本就是量出两个模块的高度，然后用margin属性来设置使红色模块上下左右相对于灰色模块居中，这里给的灰色模块是600px * 600px的大小，红色模块是100px*100px的大小。CSS代码实现如下：

　　这样就达到预期效果了。