JS中style属性
解决办法:
1、先定义一个CSS规则,然后this.className=''
2、document.getElementByIdx_x("a").style.cssText="border-collapse:collapse;border-spacing:1;border:1 solid #0B2565;background-color:white;color:black;text-align='center';"
JS操作css的float属性的特殊写法
使用js操作css属性的写法是有一定的规律的:
1、对于没有中划线的css属性一般直接使用style.属性名即可。
如:obj.style.margin,obj.style.width,obj.style.left,obj.style.position等。
2、对于含有中划线的css属性,将每个中划线去掉并将每个中划线后的第一个字符换成大写即可。
如:obj.style.marginTop,obj.style.borderLeftWidth,obj.style.zIndex,obj.style.fontFamily等。
这个规律我想大多数的前端开发者也都熟知。但在css中有一个特殊的属性其js使用方法比较特殊。
这个特殊的属性就是:float。我们不能直接使用obj.style.float来使用,这样操作是无效的。
其正确的使用方法是为:IE:obj.style.styleFloat,其他浏览器:obj.style.cssFloat。
CSS 和 JavaScript 标签 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 |
padding-left | paddingLeft |
padding-right | paddingRight |
padding-top | paddingTop |
CSS 语法(不区分大小写) | JavaScript 语法(区分大小写) |
background | background |
background-attachment | backgroundAttachment |
background-color | backgroundColor |
background-image | backgroundImage |
background-position | backgroundPosition |
background-repeat | backgroundRepeat |
color | color |
CSS语法(不区分大小写) | JavaScript 语法(区分大小写) |
display | display |
list-style-type | listStyleType |
list-style-image | listStyleImage |
list-style-position | listStylePosition |
list-style | listStyle |
white-space | whiteSpace |
CSS 语法(不区分大小写) | JavaScript 语法(区分大小写) |
font | font |
font-family | fontFamily |
font-size | fontSize |
font-style | fontStyle |
font-variant | fontVariant |
font-weight | fontWeight |
CSS 语法(不区分大小写) | JavaScript 语法(区分大小写) |
letter-spacing | letterSpacing |
line-break | lineBreak |
line-height | lineHeight |
text-align | textAlign |
text-decoration | textDecoration |
text-indent | textIndent |
text-justify | textJustify |
text-transform | textTransform |
vertical-align | verticalAlign |
From:http://blog.sina.com.cn/s/blog_7de0b6230100z55x.html
JS中style属性的更多相关文章
- js中style.display=""无效的解决方法
本文实例讲述了js中style.display=""无效的解决方法.分享给大家供大家参考.具体解决方法如下: 一.问题描述: 在js中我们有时想动态的控制一个div显示或隐藏或更多 ...
- js中style的属性
下面这些属性都是通过js的style来设置css.只是整理了一部分,详细的可以参考相应的学习网站,不好的地方欢迎大家拍砖. alignContent :"" 属性在弹性容器内的各项 ...
- js中style,currentStyle和getComputedStyle的区别以及获取css操作方法
在js中,之前我们获取属性大多用的都是ele.style.border这种形式的方法,但是这种方法是有局限性的,该方法只能获取到行内样式,获取不了外部的样式.所以呢下面我就教大家获取外部样式的方法,因 ...
- JS中style.display和style.visibility的区别
在JS中可以通过设置style.display或者style.visibility属性来控制元素是否显示,在style.display=block和style.visibility=visible的时 ...
- 定制Three.js中Material属性
1.找到想要更改的着色器代码
- js中style,currentStyle和getComputedStyle的区别以及获取css样式操作方法
用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. currentStyle可以弥补style的不足(可获取内联样式,内部样式和外部样式),但是只适用于IE. g ...
- js中常用属性备忘
. onsubmit一般用来做验证的,用来控制表单提交的. 之前使用数据提交基本上使用ajax做数据提交,在数据验证的时候,只有通过数据验证之后,才会post/get数据到对应api文件,但是这次涉及 ...
- CSS和JS标签style属性对照表
盒子标签和属性对照 CSS语法(不区分大小写) JavaScript语法(区分大小写) border border border-bottom borderBottom border-bottom-c ...
- js中Prototype属性解释及常用方法
1.prototype的定义 javascript中的每个对象都有prototype属性,Javascript中对象的prototype属性的解释是:返回对象类型原型的引用. 每一个构造函数都有一个属 ...
随机推荐
- C语言实现单链表-01版
单链表的应用非常广,它可以实现栈,队列等: Problem 我对学习任何东西都希望能找到尽可能简单的例子,而不是看起来好高大上的: 对链表这样简答的数据结构,有些书也是写得太过“完美”啦: 初学者很难 ...
- atitit.spring3 mvc url配置最佳实践
atitit.spring3 mvc url配置最佳实践 1. Url-pattern bp 1 2. 通用星号url pattern的问题 1 3. Other code 1 4. 参考 2 1. ...
- 啊哈C!思考快你一步——用编程轻松提升逻辑力
啊哈C!思考快你一步——用编程轻松提升逻辑力(双色)(每个人都应该学习如何编程,因为它教会你如何思考.——史蒂夫.乔布斯) 啊哈磊著 ISBN 978-7-121-21336-6 2013年9月出版 ...
- seajs加载jquery时提示$ is not a function该怎么解决
这篇文章主要介绍了seajs加载jquery时提示$ is not a function该怎么解决的相关资料,需要的朋友可以参考下 jquery1.7以上的都支持模块化加载,只是jquery默认的是支 ...
- linux shell 多线程执行程序
Shell中并没有真正意义的多线程,要实现多线程可以启动多个后端进程,最大程度利用cpu性能. 直接看代码示例吧. (1) 顺序执行的代码 #!/bin/bash date ` do { echo & ...
- 小白学数据分析----->DNU/DAU
行业指标观察分析-DNU/DAU 写在分析之前 一直以来,我们对于数据都是在做加法,也希望这个过程中,不断搜罗和变换出来更多的数据指标,维度等等.而在实际的分析中,我们发现,一如我们给用户提供产品一样 ...
- 如何在maven项目的pom.xml文件中添加jar包
在使用maven进行项目开发时,我们需要在pom.xml文件中添加自己所需要的jar包.这就要求我们获取jar包的groupId和artifactId. 我们可以在一些maven仓库上搜索我们所需要的 ...
- Android源码分析-全面理解Context
前言 Context在android中的作用不言而喻,当我们访问当前应用的资源,启动一个新的activity的时候都需要提供Context,而这个Context到底是什么呢,这个问题好像很好回答又好像 ...
- [Aaronyang] 写给自己的WPF4.5 笔记23 [3d交互与动画 4/4]
效果图预览: 1. 3d中的命中测试 我新建了一个空的窗口,用zam做了一个长方体,深度很小.然后导出xaml <Viewport3D x:Name="ZAM3DViewport3D& ...
- apache 80端口部属多站点配置
1.在httpd.conf文件里启用虚拟主机功能,即去掉下面配置项前面的# #LoadModule vhost_alias_module modules/mod_vhost_alias.so 2..在 ...