zoukankan      html  css  js  c++  java
  • [转载]Js Style属性

     原文地址:http://blog.163.com/zhuxiaobin1987@126/blog/static/2789885320127151534101/

    解决办法:

    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

  • 相关阅读:
    一个实现编译次数记录的jsfl
    特殊的RSS图标设置,您可以免费使用
    jquery实现的视差滚动教程(视差大背景效果)
    40个免费的wordpress主题推荐
    php+mysql方便的查询
    jQuery 简单实现select二级联动
    我对Oracle的刷未提交数据到文件的学习体会
    dbms_output.put_line的小例子
    isqlplus 的 define 与 pl/sql 的 &
    PLSQL 的 for循环的小例子
  • 原文地址:https://www.cnblogs.com/pnyh5/p/4235597.html
Copyright © 2011-2022 走看看