原生JS控制CSS样式语法对照

CSS与JS紧密配合，为我们的页面增添了很多别致的效果。为了达到某种特殊的效果我们需要用Javascript动态的去更改某一个标签的CSS属性。

例如常用的关闭某个漂浮的广告显示:document.getElementById('ad').style.display='none';相当于：.ad{ display:none}.

下面就是JS 控制CSS样式表的语法对照： 

 

CSS语法 (不区分大小写)JavaScript语法 (区分大小写) borderborder border-bottomborderBottom border-bottom-colorborderBottomColor border-bottom-styleborderBottomStyle border-bottom-widthborderBottomWidth border-colorborderColor border-leftborderLeft border-left-colorborderLeftColor border-left-styleborderLeftStyle border-left-widthborderLeftWidth border-rightborderRight border-right-colorborderRightColor border-right-styleborderRightStyle border-right-widthborderRightWidth border-styleborderStyle border-topborderTop border-top-colorborderTopColor border-top-styleborderTopStyle border-top-widthborderTopWidth border-widthborderWidth clearclear floatfloatStyle marginmargin margin-bottommarginBottom margin-leftmarginLeft margin-rightmarginRight margin-topmarginTop paddingpadding padding-bottompaddingBottom padding-leftpaddingLeft padding-rightpaddingRight padding-toppaddingTopbackgroundbackground background-attachmentbackgroundAttachment background-colorbackgroundColor background-imagebackgroundImage background-positionbackgroundPosition background-repeatbackgroundRepeat colorcolor displaydisplay list-style-typelistStyleType list-style-imagelistStyleImage list-style-positionlistStylePosition list-stylelistStyle white-spacewhiteSpace fontfont font-familyfontFamily font-sizefontSize font-stylefontStyle font-variantfontVariant font-weightfontWeight letter-spacingletterSpacing line-breaklineBreak line-heightlineHeight text-aligntextAlign text-decorationtextDecoration text-indenttextIndent text-justifytextJustify text-transformtextTransform vertical-alignverticalAlign

感謝Yangz!原文來自：Yangz博客