css中的top和left属性_html/css

### top属性需要和absolute绑定使用1. 如果一个元素设置了top和left属性,且本身设置了position属性,值为absolute或者relative效果是:以距离它最近的position属性为absolute或relative的父元素进行偏移,如果没有这样的父元素,则以body元素进行偏移.例如:```.father {	width:1000px;	height: 1000px;	position: relative;	background-color: blue;}.son {	width:333px;	height: 333px;	background-color: white;	top:166px;	left: 66px;	position: relative;}```### margin和absolute同事存在 顺便说下,如果我们在给一个元素同时设置了margin和position值时,可能会出现margin不生效的状况```.father {	width:1000px;	height: 1000px;	position: absolute;	background-color: blue; margin:0 auto;}```此时,father类所对应元素的margin效果是不生效的.因为* 绝对定位absolute是根据它的祖先元素(最近一个设置了position属性的上级元素)利用设置top和left属性来进行偏移.* margin则是根据它的父元素来进行偏移### 总结也就是说 * 如果一个元素设置了position属性,那么它的偏移就该用top,left来设置 * 如果想要让它相对与父元素偏移,则父元素也要设置position属性,如果没有其他需要的话,建议用relative * 如果本元素设置了position属性为absolute后,margin的设置就无效了 * 要想本元素的margin生效,那么自己的position属性应该设置为relative