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属性的解释是:返回对象类型原型的引用. 每一个构造函数都有一个属 ...
随机推荐
- Atitit.实现继承的原理and方法java javascript .net c# php ...
Atitit.实现继承的原理and方法java javascript .net c# php ... 1. 实现继承的问题 1 2. 如何拷贝基类方法?采用prototype原型方式,通过冒充对象 1 ...
- atitit.sql server2008导出导入数据库大的表格文件... oracle mysql
atitit.sql server2008导出导入数据库大的表格文件... 1. 超过80M的文件是不能在查询分析器中执行的 1 2. Oracle ,mysql大的文件导入 1 2.1. 使用sql ...
- Atitit.提升稳定性-----分析内存泄漏PermGen OOM跟解决之道...java
Atitit.提升稳定性-----分析内存泄漏PermGen OOM跟解决之道...java 1. 内存区域的划分 1 2. PermGen内存溢出深入分析 1 3. PermGen OOM原因总结 ...
- paip.自适应网页设计 跟 响应式 设计的区别跟原理and实践总结
paip.自适应网页设计 跟 响应式 设计的区别跟原理and实践总结 响应式Web设计(Responsive Web design)的理念是: 1 #-----------自适应布局VS响应式布局 2 ...
- 搭建wamp环境,数据库基础知识
服务器管理软件php Apache.net IISjava Tomcat 服务器管理软件起到的作用:管理服务器工作,具体的工作如下:1.静态页面用户将请求发送到服务器,服务器中的服务器管理软件将请求发 ...
- 開啟apache的日誌功能,但是不記錄.js;.css;.jpg;.ico;.png等訪問記錄
維護web伺服器最重要的就是要每天都關注網站的訪問日誌,但是每天面對幾百兆的日誌文件實在是非常頭大,所以可以從根源上給日誌減肥一下,讓日誌只記錄對自己有用的內容就變得非常重了. Nginx伺服器要修改 ...
- java.lang.ClassNotFoundException: org.junit.Assume$AssumptionViolatedException
java.lang.ClassNotFoundException: org.junit.Assume$AssumptionViolatedException 在spring框架中进行单元测试,出现标题 ...
- 分布式Hadoop安装(二)
二.集群环境安装Zookeeper 1. hadoop0,namenode机器下,配置zookeeper,先解压安装包. 使用命令:tar -zxvf zookeeper-3.4.4. ...
- LeetCode:Container With Most Water,Trapping Rain Water
Container With Most Water 题目链接 Given n non-negative integers a1, a2, ..., an, where each represents ...
- Android Studio 快捷键 for mac
Action Mac OS Win/Linux 打开文件 Cmd + shift + O 打开Class文件 Cmd + O 覆写方法 Ctrl + O 生成方法(重写构造.setter ...