HTML中脱离文档流的元素有：
-
position: absolute- 元素相对于最近的已定位（非 static）祖先元素定位。 -
position: fixed- 元素相对于浏览器窗口定位。 -
float: left或float: right- 元素向左或向右浮动，周围的内容会环绕它。
没有脱离文档流的元素是：
-
position: static- 默认定位方式，不脱离文档流。 -
position: relative- 元素相对于正常位置定位，但不脱离文档流。
static(静态) 没有特别的设定，遵循基本的定位规定，不能通过z-index进行层次分级，这是默认值。
relative(相对定位) 对象不可层叠、不脱离文档流，参考自身静态位置通过 top,bottom,left,right 定位，并且可以通过z-index进行层次分级。
absolute(绝对定位) 脱离文档流，通过 top,bottom,left,right 定位。选取其最近一个最有定位设置的父级对象进行绝对定位，如果对象的父级没有设置定位属性，absolute元素将以body坐标原点进行定位，可以通过z-index进行层次分级。
fixed（固定定位） 这里所固定的参照对像是可视窗口而并非是body或是父级元素，其总是固定在浏览器窗口的某个位置，并且不受滚动的影响，是绝对的坐标定位。可通过z-index进行层次分级。
绝对位置
style="position: absolute;left: 218px;top: 0%;"
style="position: absolute;bottom:5px;right:5px ;"
float
<a href="/home/"> <button style="float:right;background-color:#353c48;color:white">主页</button> </a>
相对位置 :margin外边距 padding内边距
style="border:1px solid black;width:200px;text-align:left;margin-left:1200px;padding-left:10px"
修改width:500px,height 同
修改text-align: right
修改margin-left :200px
margin-left:-webkit-calc(50% - 100px) 注意减号左右的空格
修改padding-left :200px
