如何用JS控制CSS基本样式

合集下载
相关主题
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

用JS控制CSS基本样式的方法

CSS code

.class1

{

width:10px;

background-color: red;

}

HTML code

New Document

aaa

(2)

New Document

aaa

还可以用 document.styleSheets(i).href 可以知道当前页面中引用的每个css的文件!

另:CSS属性与JavaScript编码对照表

(一定要注意,上次本人_何向阳,在使用js修改css的中margin-left属性时,总报"left"未定义,后来,找了好多资料,才发现在js中,margin-left 的写法为:marginLeft,恍然大悟,希望遇到相同问题的朋友,谨慎对待。)

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

比如:鼠标经过一个图片时我们让图片加一个边框,代码可能是这样:JavaScript中style后面的属性应该是什么?

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

border-right-width borderRightWidth

border-style borderStyle

border-top borderTop

border-top-color borderTopColor

border-top-style borderTopStyle

border-top-width borderTopWidth

border-width borderWidth

clear clear

float floatStyle

margin margin

margin-bottom marginBottom

margin-left marginLeft

margin-right marginRight

margin-top marginTop

padding padding

padding-bottom paddingBottom

相关文档
最新文档