`
zhangb5228509
  • 浏览: 5161 次
社区版块
存档分类
最新评论

JS控制CSS样式语法对照

阅读更多

JS控制CSS样式语法对照

CSS与JS紧密配合,为我们的页面增添了很多别致的效果。为了达到某种特殊的效果我们需要用Javascript动态的去更改某一个标签的CSS属性。

例如常用的关闭某个漂浮的广告显示:document.getElementById('ad').style.display='none';相当于:.ad{ display:none}.

下面就是JS 控制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-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
background background
background-attachment backgroundAttachment
background-color backgroundColor
background-image backgroundImage
background-position backgroundPosition
background-repeat backgroundRepeat
color color
display display
list-style-type listStyleType
list-style-image listStyleImage
list-style-position listStylePosition
list-style listStyle
white-space whiteSpace
font font
font-family fontFamily
font-size fontSize
font-style fontStyle
font-variant fontVariant
font-weight fontWeight
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
分享到:
评论

相关推荐

    js控制CSS样式属性语法对照表

    CSS与JS紧密配合,为...下面就是JS 控制CSS样式表的语法对照: 盒子标签和属性对照 CSS语法(不区分大小写) JavaScript语法(区分大小写) border border border-bottom borderBottom border-botto

    js中css对照表

    ### JavaScript与CSS属性对照表详解 #### 前言 在Web开发中,JavaScript与CSS是两个非常重要的技术。为了更好地实现动态效果和交互性,开发者经常需要通过JavaScript来操作DOM元素的样式。这就涉及到了JavaScript...

    JavaScript CSS Style属性对照表

    通过本文的介绍,我们可以看到,在JavaScript中动态更改HTML元素的CSS样式非常方便。只需要记住CSS属性名到JavaScript属性名的转换规则,即可轻松实现动态效果。此外,掌握这些基本的属性对照表对于提高前端开发效率...

    精通CSS+DIV样式和布局详细源码

     本书系统地讲解了CSS层迭样式表的基础理论和实际运用技术,通过大量实例对CSS进行深入浅出的分析,主要包括CSS的基本语法和概念,设置文字、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS滤镜的使用。...

    CSS和JavaScript标签对照表

    通过以上详细对比,我们可以清晰地了解到CSS与JavaScript之间对于同一属性的不同表示方法,这对于实际开发中进行动态样式修改是非常有用的。希望这些知识点能帮助你在Web开发中更加高效地工作。

    DHTML,js,css资料

    标题中的"DHTML, js, css资料"指的是网页开发中的三个核心技术:动态超文本标记语言(Dynamic HTML,简称DHTML)、JavaScript和层叠样式表(Cascading Style Sheets,简称CSS)。这些技术是构建现代交互式网页的基础...

    CSS和JavaScript标签style属性对照表

    在网页设计和开发中,CSS(层叠样式表)和JavaScript是两个至关重要的技术。CSS用于定义页面元素的样式,而JavaScript则提供了交互性。两者结合可以创建动态、响应式的用户体验。下面我们将详细讨论这些标签和属性的...

    《网页设计与制作项目教程(HTML+CSS+JavaScript)》-配套源码.zip

    在学习过程中,建议首先掌握HTML的基本语法和元素,然后学习CSS的布局技巧和样式控制,最后深入JavaScript,熟悉其语法和常用库、框架的应用。同时,不断练习编写代码,对照源码分析,逐步提高自己的网页设计和制作...

    Prettify 代码高亮 源码 css js

    Prettify 是 Google 推出的一个开源项目,主要用于 JavaScript、CSS 和 HTML 等编程语言的语法高亮。在网页开发中,代码高亮能够帮助开发者更快速地理解和分析代码,提高工作效率。 **Prettify 的工作原理**: ...

    CSS+JS&VBS+配色 四个CHM

    综上所述,这个压缩包包含了关于前端开发的多个重要方面:CSS2作为网页样式的基础,JS和VBS提供了动态功能,而配色常识则有助于提升设计质量。无论是初学者还是经验丰富的开发者,都可以从这些资料中受益匪浅,提升...

    css样式标签和js语法属性区别

    CSS语法(不区分大小写) JavaScript语法(区分大小写) border border border-bottom borderBottom border-bottom-color borderBottomColor border-bottom-style borderBottomStyle border-bottom-width ...

    css转stylesheet插件,适用于鸿蒙、RN.zip

    在React Native中,虽然主要使用JavaScript来编写用户界面,但仍然支持类似CSS的样式语法,这使得React Native开发者可以借鉴他们在Web开发中的经验。 然而,鸿蒙系统(HarmonyOS)的开发环境和RN有所不同,它有...

    《精通CSS.DIV网页样式与布局》配套视频教程

    本书系统地讲解了CSS层迭样式表的基础理论和实际运用技术,通过大量实例对CSS进行深入浅出的分析,主要包括CSS的基本语法和概念,设置文字、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS滤镜的使用。...

    CSS技巧与工具(EditPlus语法文件下载)

    标题中的“CSS技巧与工具(EditPlus语法文件下载)”暗示了我们即将探讨的是关于CSS(Cascading Style Sheets)的高效编程方法以及EditPlus编辑器在其中的作用。CSS是一种用于描述HTML或XML(包括如SVG、MathML等各种...

    PS+CSS+JS+PHP常用

    在IT行业中,PS、CSS、JS和PHP是四个非常关键的技术领域,它们分别代表了图像处理、网页样式、前端交互和后端开发的核心工具。下面将详细解释这些领域的常用操作、方法和属性。 首先,Photoshop(PS)是Adobe公司...

    收藏 CSS JS VBS 参考手册

    【标题】"收藏 CSS JS VBS 参考手册" 是一个综合性的资源集合,涵盖了三种在Web开发中至关重要的编程语言和技术:CSS(层叠样式表)、JavaScript和VBScript。这些参考手册通常包含了详尽的语法说明、示例代码以及...

    Web应用设计实践(HTML/JavaScript/CSS):班级网页-doc文档

    3. **CSS基础**:CSS用于设计网页样式,你需要了解选择器的概念,学会如何定义颜色、字体、边距、布局等样式属性。此外,掌握盒模型、浮动、定位、响应式设计(适配不同设备屏幕)等高级技巧,能让你的设计更加专业...

Global site tag (gtag.js) - Google Analytics