js通过标签元素id,⽤ElementById().style设
置。。。
对定义了id的html标签元素,js可以通过以下⽅法修改标签元素的css样式:
⽅法⼀:
对标签定义⼀个css样式:position标签属性
⽅法⼆:
对标签定义多个css样式:
var a = ElementById("idname");
with(a.style){
color = red;
font-size = 12px;
.......
}
以下是js中ElementById("idname").stylexxx属性可以定义的css属性对照
盒⼦标签和属性对照
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-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
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论