如何用JS控制CSS基本样式精选.docVIP

用JS控制样式 CSS code .class1 {width:10px;background-color: red;} HTML code !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//ENHTMLHEADlink rel=stylesheet type=text/css href=abc.css / TITLE New Document /TITLEscriptwindow.onload=fnInit;function fnInit(){// 访问 styleSheet 中的一条规则, 将其 backgroundColor 改为蓝色。var oStyleSheet=document.styleSheets[0];var oRule=oStyleSheet.rules[0];oRule.style.backgroundColor=#0000FF;} /script/HEAD BODYdiv class=class1aaa/div/BODY/HTML (2) !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//ENHTMLHEADTITLE New Document /TITLE style type=text/css!--#apDiv1 {position:absolute;width:399px;height:195px;z-index:1;border:1px solid #000;background-color:#CCCCCC;}--/style scriptwindow.onload = function(){alert(document.getElementById(apDiv1).currentStyle.width)} /script /HEAD BODYdiv id=apDiv1aaa/div /BODY/HTML 还可以用?? document.styleSheets(i).href?? 可以知道当前页面中引用的每个css的文件！ 另：CSS属性与JavaScript编码对照表 （一定要注意， 上次本人_何向阳，在使用js修改css的中margin-left属性时，总报left未定义，后来，找了好多资料，才发现在js中，margin-left的写法为:marginLeft，恍然大悟，希望遇到相同问题的朋友，谨慎对待。） CSS与JS紧密配合，为我们的页面增添了很多别致的效果。为了达到某种特殊的效果我们需要用Javascript动态的去更改某一个标签的CSS属性。 ??? 比如：鼠标经过一个图片时我们让图片加一个边框，代码可能是这样：JavaScript中style后面的属性应该是什么？script type=text/javascript??? function imageOver(e) {??? e.style.border=1px solid red;??? }??? function imageOut(e) {??? e.style.borderWidth=0;??? }??? /script img src=css.png onmouseover=imageOver(this) onmouseout=imageOut(this) / ??? JavaScript CSS Style属性对照表 ??? 盒子标签和属性对照CSS语法 (不区分大小写) 　　JavaScript语法 (区分大小写) border 　　border border-bottom 　　borderBottom border-bottom-color 　　borderBottomColor border-bottom-style　　 borderBottomStyle border-bottom-width 　　borderBottomWidth border-color 　　borderColor border-left 　　borderLeft border-left-color 　　borderLeftColor border-left-style 　　borderLeftStyle border-left-width 　　borderLeftWidth border-right 　　borderRight border-right-color 　　borderRightColor border-right-style 　　borderRightStyle borde