`

CSS和Javascript的标签属性对应表

阅读更多

在写javascript中,经常要用到style对象的css属性,很多不记得

其实很好记,基本就是CSS中的“-”转化为javascript的驼峰写法,除了注意下float

盒子标签和属性对照颜色和背景标签和属性对照样式标签和属性对照文字样式标签和属性对照文本标签和属性对照

可以500%提高开发效率的前端UI框架!  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
 
可以500%提高开发效率的前端UI框架!  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

可以500%提高开发效率的前端UI框架! 

提示:
CSS中的float属性是个例外,因为float是javascript的保留关键字,在IE中使用的是styleFloat,而其他浏览器则使用cssFloat.

0
0
分享到:
评论

相关推荐

    CSS和JavaScript标签style属性对照表

    本文将详细介绍CSS中的样式属性与JavaScript中对应的`style`属性之间的关系,并通过具体示例帮助读者更好地理解和应用这些属性。 #### CSS与JavaScript中的Style属性对照 以下是对CSS和JavaScript中style属性的...

    《html+css+javascript 网页制作案例教程》源代码

    《HTML+CSS+JavaScript 网页制作案例教程》是一本深入浅出的前端开发教材,旨在帮助读者掌握网页设计的基础知识和技能。这个压缩包包含的源代码是书中各个实例的实现,提供了丰富的实践材料,使学习者能够通过实际...

    CSS和JS标签style属性对照表

    ### CSS与JavaScript Style属性对照表解析 在网页开发过程中,我们经常会遇到需要通过JavaScript来动态修改元素样式的场景。为了确保代码的正确性和兼容性,理解CSS属性与JavaScript中的style对象属性之间的映射...

    CSS和JS标签style属性对照表(方便js开发的朋友).docx

    本文将详细解析CSS和JavaScript中的style属性对照表,这对于JS开发者理解和操作DOM元素的样式非常有帮助。 1. **边框属性(Border Properties)** - CSS 中,设置边框的属性如 `border`, `border-bottom`, `border...

    javascript与css标签对照表

    本篇将详细介绍如何通过 JavaScript 来操作 CSS 的各种标签和属性。 ### 边框属性 在 CSS 中,边框可以通过 `border` 属性进行设置,包括 `border-width`、`border-style` 和 `border-color`。在 JavaScript 中,...

    CSS与JS属性对照表

    在网页设计和开发中,CSS(层叠样式表)和JavaScript是两个不可或缺的工具。CSS主要负责页面的布局和外观,而JavaScript则用于增加交互性和动态功能。它们之间有一些属性是可以相互对应的,使得开发者可以通过...

    JavaScript大转盘代码html+css+JavaScript

    此外,`LuckDraw`可能是包含这些代码文件的文件夹或主文件名,里面可能有HTML、CSS和JavaScript文件,分别对应页面结构、样式和逻辑。 总之,JavaScript大转盘是一个结合了HTML布局、CSS动画和JavaScript事件处理的...

    css与JavaScript基础

    2. 属性和值:CSS由属性和对应的值组成,例如`color`属性用于设置文字颜色,值可以是颜色名称、十六进制代码或RGB值。 3. 层叠性:CSS的“级联”特性意味着多个样式可以应用于一个元素,当存在冲突时,根据特定规则...

    javascript+css 实现的web tab

    CSS(层叠样式表)是用于控制网页元素样式和布局的语言。在实现Tab组件时,CSS主要负责以下几个方面: 1. **布局**:CSS可以定义Tab按钮和内容区域的布局,比如使用Flexbox或Grid布局,使得它们在页面上整齐排列。 ...

    韩顺平《轻松搞定网页设计HTML+CSS+JAVASCRIPT》HTML学习笔记.pdf

    根据韩顺平的《轻松搞定网页设计HTML+CSS+JAVASCRIPT》HTML学习笔记.pdf,我们可以总结出以下HTML基础知识点: 1. HTML基本结构:HTML文档的基本结构包括、、三部分,其中是根元素,用于存放元数据,用于存放页面...

    html+css+javascript仿b站首页

    【HTML+CSS+JavaScript 仿B站首页】项目是一个典型的前端网页开发实例,它结合了三个核心技术:HTML(超文本标记语言)、CSS(层叠样式表)和JavaScript,用于构建一个与哔哩哔哩(B站)首页类似的交互式用户界面。...

    _html_css_javascript_sql_jdbc_jsp(el_jstl)_servlet

    选择器包括标签选择器、类选择器(`.myclass`)和ID选择器(`#hhh`),它们分别对应HTML元素的标签名、`class`属性和`id`属性。CSS的优先级:行内式 > 内联式 > 外链式。 JavaScript是实现网页动态交互的关键,它...

    用CSS写的Tab滑动轮

    实际上,当点击不同的Tab项时,JavaScript会修改对应内容区域`<div>`的CSS类或者直接改变其CSS属性,如`display`或`opacity`,以达到只显示一个内容区域而隐藏其他区域的目的。这种控制逻辑是实现Tab切换功能的核心...

    CSS和JS对照表

    - **JavaScript**: 该属性没有直接对应的JavaScript属性,但可以通过修改CSS类来间接实现。 **1.6 浮动(`float`)** - **CSS**: `float` 属性使元素脱离文档流并移到其父元素的一侧。 - **JavaScript**: 对于浮动,...

    基于HTML+CSS+JavaScript实现的小霸王坦克游戏源码,支持双人模式

    5. 游戏对象和状态管理:在JavaScript中,每个游戏元素(如坦克、子弹、砖块)都可以被表示为对象,这些对象包含其属性(如位置、速度、生命值等)和方法(如移动、射击)。游戏的状态管理则涉及到如何跟踪和更新...

    纯DIV+CSS布局的标签云,扩展性好

    当新的标签加入时,只需要在HTML中添加对应的`<div>`元素,CSS和JavaScript可以自动适应这些变化。此外,通过模块化和组件化的开发方式,可以将标签云作为一个独立的组件复用在不同的页面或项目中。 总结来说,纯...

    Form Validation Using HTML, CSS and JavaScript.zip

    通过这个项目,你不仅可以深化对HTML、CSS和JavaScript的理解,还能提高解决实际问题的能力,为开发更复杂、交互性强的Web应用程序打下坚实基础。无论你是初学者还是有一定经验的开发者,这个项目都将帮助你提升表单...

    JavaScript动态添加css样式和script标签

    在这个例子中,当页面加载完成后,JavaScript会创建一个新的`<link>`元素,设置其`rel`属性为"stylesheet"表示这是一个样式表链接,然后设置`href`属性指向CSS文件的URL。最后,这个新的`<link>`元素被添加到`<head>...

Global site tag (gtag.js) - Google Analytics