JavaScript CSS Style属性对照表「建议收藏」

JavaScript CSS Style属性对照表「建议收藏」为了达到某种特殊的效果我们需要用Javascript动态的去更改某一个标签的Css属性。比如:鼠标经过一个图片时我们让图片加一个边框,代码可能是这样:<script type=”text/javascript”>functionimageOver(e) {e.style.border=”1px solid red”;}functionimageOut(e) {e.sty…

大家好,又见面了,我是你们的朋友全栈君。

为了达到某种特殊的效果我们需要用Javascript动态的去更改某一个标签的Css属性。比如:鼠标经过一个图片时我们让图片加一个边框,代码可能是这样:

<script type=”text/javascript”>
function imageOver(e) {

e.style.border=”1px solid red”;
}
function imageOut(e) {

e.style.borderWidth=0;
}
</script>
<img src=”phplamp.gif” οnmοuseοver=”imageOver(this)” οnmοuseοut=”imageOut(this)” />

JavaScript中style后面的属性应该是什么?

JavaScript CSS 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
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/145743.html原文链接:https://javaforall.net

(0)
上一篇 2022年5月16日 下午5:20
下一篇 2022年5月16日 下午5:40


相关推荐

  • psp坏点修复(psp贴吧)

    psp坏点&鉴别液晶坏点  暗点 亮点PC上挑选液晶LCD,借助第3方软件 例如NOKIA MONITOR TESTER 需要指出的是,亮点,暗点,坏点问题是液晶屏幕不可避免的先天性"生理缺陷",一般情况下,3个以下的"点"都是可以接受的.亮点:在黑屏幕情况下单纯地显示一种颜色的点,通常表现为在RED,GREEN,BLUE3种纯色模式下均显示白色.暗点:在R G B3种纯色模式下,均显示为黑色或不

    2022年4月15日
    55
  • 详细说明Ipad1 4.3.5的越狱过程

    详细说明Ipad1 4.3.5的越狱过程前言,使用Ipad很久了,但是都是老实巴交的使用APPLE提供的功能,没有使用很多的软件,因为要收费,只是看一看pdf和视频。但是时间长了,感觉不新鲜了,看了很久越狱的好处和弊端,心里痒痒的。最好终于手痒痒了,开始动手了。但是开始不顺利,我一直是跟着升级固件,最后升级到4.3.1

    2026年1月28日
    4
  • malloc函数的使用

    malloc函数的使用include stdio h 先讲最基本的语法 最后是完整的例子 2021 5 309 30malloc 是 memory 内存 allocate 分配 的缩写 请求分配内存 include malloc h malloc 在 malloc h 文件中放着 intmain void inti 5 14 行 分配了 4 个字节静态分配 malloc h stdio h

    2026年3月16日
    1
  • Kibana KQL查询语法

    Kibana KQL查询语法1 查看 kibana 状态 http 172 20 10 10 5601 status

    2026年3月20日
    2
  • git使用步骤_小猪酸奶的使用步骤

    git使用步骤_小猪酸奶的使用步骤厉害了!小猪用Git一年多后的精华总结标签:Git描述性文字:不要问我为什么用这种骚猪风格的标题,现在写博文,标题不骚,人家都不乐意看~接触Git到现在有一年多了,对Git使用也是日渐精进,虽说不上很熟络,但也算入门,决定年前总结下,所以有了此文。Git博大精深,还有很多的东西需要学习,比如自己搭建啊,一些便利工具的使用啊,一些疑难杂症解决方案啊等等,当然这就是下一话的事了。本文讲述的

    2026年2月13日
    5
  • Python注释方式有哪些

    Python注释方式有哪些注释是对一段代码的解释和说明 可提高程序代码的可读性 让人们能够更加轻松地了解代码 尤其在大型项目开发和团队项目中 注释是必不可少的 任何编程语言都少不了注释 Python 也不例外 以下是 Python 注释的具体用法 1 单行注释 Python 编程语言的单行注释常以 开头 单行注释可以作为单独的一行放在被注释代码行之上 也可以放在语句或者表达式之后 实例 coding

    2026年3月16日
    1

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号