transform-style:其中flat
值为默认值,表示所有子元素在2D平面呈现。preserve-3d
表示所有子元素在3D空间中呈现则该元素的所有子元素都将被平展到该元素的2D平面中进行呈现。沿着X轴或Y轴方向旋转该元素将导致位于正或负Z轴位置的子元素显示在该元素的平面上,而不是它的前面或者后面。如果对一个元素设置了transform-style
的值为preserve-3d
,它表示不执行平展操作,他的所有子元素位于3D空间中。
border-radius:圆角边框 左 右 右下角 左下角
1.实心圆设置border-radius:height:100px;100px;border:50px;
2.左半圆:border-radius:height:100px;50px;border:50px 0px 0px 50px;
3.box-shadow是向盒子添加阴影。支持添加一个或者多个。
4.box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式];
box-shadow:4px 2px 1px 4px #f00 inset(插入的方向是相反的);
添加多个阴影:box-shadow:3px 6px 9px 3px #000,-3px -6px 9px 4px #fff inset,-6px 7px 5px 4px 3px blue;
5.为边框应用图片border-image