css部分样式

字体倾斜

font-style

说明：
|

默认值：	normal
继承性：	yes
版本：	CSS1
JavaScript 语法：	object.style.fontStyle=“italic”

值：

值	描述
normal	默认值。浏览器显示一个标准的字体样式。
inherit	规定应该从父元素继承字体样式。
italic	浏览器会显示一个斜体的字体样式。
oblique	浏览器会显示一个倾斜的字体样式。

oblique和italic区别：
italic和oblique都是向右倾斜的文字, 但区别在于Italic是指斜体字，而Oblique是倾斜的文字（让没有斜体属性的文字倾斜），对于没有斜体的字体应该使用Oblique属性值来实现倾斜的文字效果

transform属性

说明：

默认值：	none
继承性：	no
版本：	CSS3
JavaScript 语法：	object.style.transform=“rotate(7deg)”

值：

值	描述
none	定义不进行转换。
matrix(n,n,n,n,n,n)	定义 2D 转换，使用六个值的矩阵。
matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)	定义 3D 转换，使用 16 个值的 4x4 矩阵。
translate(x,y)	定义 2D 转换。
translate3d(x,y,z)	定义 3D 转换。
translateX(x)	定义转换，只是用 X 轴的值。
translateY(y)	定义转换，只是用 Y 轴的值。
translateZ(z)	定义 3D 转换，只是用 Z 轴的值。
scale(x,y)	定义 2D 缩放转换。
scale3d(x,y,z)	定义 3D 缩放转换。
scaleX(x)	通过设置 X 轴的值来定义缩放转换。
scaleY(y)	通过设置 Y 轴的值来定义缩放转换。
scaleZ(z)	通过设置 Z 轴的值来定义 3D 缩放转换。
rotate(angle)	定义 2D 旋转，在参数中规定角度。
rotate3d(x,y,z,angle)	定义 3D 旋转。
rotateX(angle)	定义沿着 X 轴的 3D 旋转。
rotateY(angle)	定义沿着 Y 轴的 3D 旋转。
rotateZ(angle)	定义沿着 Z 轴的 3D 旋转。
skew(x-angle,y-angle)	定义沿着 X 和 Y 轴的 2D 倾斜转换。
skewX(angle)	定义沿着 X 轴的 2D 倾斜转换。
skewY(angle)	定义沿着 Y 轴的 2D 倾斜转换。
perspective(n)	为 3D 转换元素定义透视视图。

transform水平居中

position: absolute;
left:50%;
transform:translateX(-50%); /* 注意浏览器兼容 */

浏览器兼容

Safari 和 Chrome	-webkit-
Firefox	-moz-
Opera	-o-
–	–
IE 9	-ms-

盒子阴影box-shadow

语法：

box-shadow: h-shadow v-shadow blur spread color inset;

说明：

默认值：	none
继承性：	no
版本：	CSS3
JavaScript 语法：	object.style.boxShadow=“10px 10px 5px #888888”

值：

值	描述
h-shadow	必需。水平阴影的位置。允许负值。
v-shadow	必需。垂直阴影的位置。允许负值。
blur	可选。模糊距离。
spread	可选。阴影的尺寸。
color	可选。阴影的颜色。
inset	可选。将外部阴影 (outset) 改为内部阴影。

字体阴影

语法：

text-shadow: h-shadow v-shadow blur color;

说明：

默认值：	none
继承性：	yes
版本：	CSS3
JavaScript 语法：	object.style.textShadow=“2px 2px #ff0000”

值：

值	描述
h-shadow	必需。水平阴影的位置。允许负值。
v-shadow	必需。垂直阴影的位置。允许负值。
blur	可选。模糊距离。
color	可选。阴影的颜色。

字体间距

letter-spacing=“3px”

注释：允许使用负值，这会让字母之间挤得更紧。

默认值：	normal
继承性：	yes

去掉input[type=“number”]的默认样式

input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
  -webkit-appearance: none !important; 
 }
/* chrome */
 
input[type="number"]{
  -moz-appearance:textfield;/* firefox */
}

数据转换成json对象

JSON.parse()