本文目录一览:
- 1、如何用JS修改已加载的CSS样式表样式?要详细的教程
- 2、js 修改css属性值
- 3、js获取css属性,更改margin-top属性,给每个a标签的margin-top属性在原基础上 +5px
- 4、JavaScript是如何改变网页的CSS样式的?
- 5、如何用JavaScript设置Div的margin参数?
如何用JS修改已加载的CSS样式表样式?要详细的教程
js是无法直接修改css文件的,但可以通过取对象的方式修改对象的样式,通常有两种方法:
1、改变className,但首先在样式表中预设定样式类。
例如:document.getElementById('obj').className='...';
2、改变cssText。
例如:document.getElementById('obj').style.height='100px';
js 修改css属性值
想要改为什么不直接把CSS文件里的width:100xp改掉?
如果这个值因为其他地方也有用到所以不能改的话
那你就在CSS文件里再设个值:
width1:80xp
想用到80xp的话就调用width1好了,不要用width:100xp
js获取css属性,更改margin-top属性,给每个a标签的margin-top属性在原基础上 +5px
可以参考下面的代码:
style
a{display:block;float:left}
/style
div style="border:1px solid #cccccc"
a id="a1" href="#" class="float_r" style="margin-top:10px;"asd/a
a id="a2" href="#" class="float_r" style="margin-top:20px;"asd/a
a id="a3" href="#" class="float_r" style="margin-top:30px;"asd/a
a id="a4" href="#" class="float_r" style="margin-top:40px;"asd/a
a id="a5" href="#" class="float_r" style="margin-top:50px;"asd/a
/div
script
for(var i=1;i6;i++){
document.getElementById('a'+i).style.marginTop = parseInt(document.getElementById('a'+i).style.marginTop)+5+'px';
}
/script
JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。
通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。它最初由Netscape的Brendan Eich设计。JavaScript是甲骨文公司的注册商标。Ecma国际以JavaScript为基础制定了ECMAScript标准。
扩展资料:
javaScript参考函数
anchor("name")用来把字符串转换为HTML锚面标志内(A NAME=)
big() 把字符串中的文本变成大字体(BIG)
blink() 把字符串中的文本变成闪耀字体(BLINK)
bold() 把字符串中的文本变成乌字体(B)
fixed() 把字符串中的文本变成流动间距字体,便电报情势(TT)
fontcolor(color)设置字符串中文本的色彩(FONT COLOR=)
Fontsize(size) 把字符串中的文本变成指定大小(FONTSIZE=)
italics() 把字符串中的白原变成斜字体(I)
Link(url)用来把字符串转换-HTML链交标志中(A HREF=)
参考资料来源:百度百科-javascript
JavaScript是如何改变网页的CSS样式的?
通常我们将网页的样式和内容分开,样式放在css文件,内容放在html文件,当html文件需要用到样式的时候,直接引用css中定义的样式就可以了。其实JavaScript也能使用css文件或直接改变样式的属性来动态的改变网页的样式。
1、JavaScript设置内联样式
改变样式最直接的方法就是改变元素节点的style属性。如:
myElement.sytle.color = “red”;
myElement.sytle.left = “40px”;
myElement.sytle.backgroundRepeat = “repeat-x”;
JavaScript设置内联样式时,采用和css设置样式一样的风格。如设置myElement的color属性时,我们可以赋值任何在css中可以用的值,所以这里除了可以使用”red”,还可以使用”blue”, ”yellow”或十六进制的”#ff0000”。
另外用JavaScript改变网页的属性还需要注意2点:
l JavaScript中采用驼峰命名法:在css中,属性名中的单词之间是用横杠隔开,如font-weight, background-color。但在JavaScript中,横杠可能被认为是减号,所以采用驼峰命名法,单词之间不用横杠,如font-weight在JavaScript中应该写成fontWeight;而background-color写成backgroundColor。
l JavaScript中属性值为字符串:在css中,属性值都写在双引号中,即要用字符串来给css相关属性赋值,同样当属性值有单位时,我们需要将单位也写在字符串中。
2、JavaScript设置外部样式
当你需要改变的样式已经在css文件中定义了,我们也可以用JavaScript直接用定义好的css样式。如下格式:
myElement.className = “someCSSclass”;
同样需要注意几点:
l 不要将className写成class,因为class是JavaScript保留的关键字,我们不能使用。
l 将定义在css中的样式直接赋值给className,就能改变myElement元素的样式。
l 当要删除元素的样式,可以给className属性赋值为空。如:
myElement.className = “”;
教程网 站-秒秒学上的JavaScript课程有一个章节专门讲解JavaScript改变样式的内容,可以看看,希望对你有帮助。
如何用JavaScript设置Div的margin参数?
在css中使用margin可以将margin-top, margin-bottom, margin-left, margin-right缩写为一个标记。margin标记可以带一个、二个、三个、四个参数,各有不同的含义。[示例代码]htmlbodydiv style="border: 1px solid red;"
div style="border: 1px solid blue; margin: 20px;"
margin: 20px;上、下、左、右各20px。
/div/divdiv style="border: 1px solid red;"
div style="border: 1px solid blue; margin: 20px 40px;"
margin: 20px 40px;上、下20px;左、右40px。
/div/divdiv style="border: 1px solid red;"
div style="border: 1px solid blue; margin: 20px 40px 60px;"
margin: 20px 40px 60px;上20px;左、右40px;下60px。
/div/divdiv style="border: 1px solid red;"
div style="border: 1px solid blue; margin: 20px 40px 60px 80px;"