垂直居中的实现
垂直居中的实现
固定宽高垂直居中
代码块
position:absolute;
left:50%;
top:50%;
width:400px;
height:200px;
margin-left:-200px;
margin-top:-100px;
不固定宽高的div垂直居中
代码块
position:fixed;
left:50%;
top:50%;
width:50%;
height:50%;
-webkit-transform:translateX(-50%);
-webkit-transform:translateY(-50%);
四分之一圆（1）
代码块
width:100px;
height:100px;
border-radius:50%;
postion:absolute
通过移动到父边框的角落，然后overflow:hidden;将超出部分隐藏；
四分之一圆（2）
代码块
border-bottom-right-radius:50px;
border-top-left-radius:50px;
浮动
盒子的位移属性有四个“top、right、bottom和left”，用来指定元素的定位位置和方向。这些属性只能在元素的“position”属性设置了“relative、absolute和fixed”属性值，才生效。著作权归作者所有。
position
绝对定位的参考点是其祖先元素设置了“relative”或者“absolute”值 。设置了位移属性的相对定位元素，他在页面中仍然是正常的、静态的，仍属于自然流。在这种情况下，其他元素不会占用相对定们元素当初的位置。此外，其他元素没有进行位置移动时，相对定伴元素可能会和其他元素重叠。
