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


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM