JS 对应CSS 样式
首先,把CSS和JS标签style属性对照表了解了:
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 |
HTML代码示例:
js代码示例:
JS 对应CSS 样式的更多相关文章
- js设置css样式.
在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...
- php有效的过滤html标签,js代码,css样式标签
过滤html标签�php中太简单了,我们可以直接使用strip_tags函数来实现了,下面给各位整理了一些关于 strip_tags函数的例子. php过滤html的函数:strip_tags(str ...
- 原生js更改css样式的两种方式
下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3 &quo ...
- 11-13 js操作css样式
1.Js操作css样式 Div.style.width=”100px”.在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性,跟实际项目是不符. ...
- js中css样式
1.js操作css样式 例如 div . style . width=“100px”. 就是在div标签内我们添加一个style属性,并设定了width值,这种写法会给标签带来大量的style属性,跟 ...
- 【javascript】原生js更改css样式的两种方式
下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3 &quo ...
- js获取css样式方法
一.CSS样式共有三种:内联样式(行间样式).内部样式.外部样式(链接式和导入式) <div id="a" style="width: 100px;height: ...
- js改变css样式
CreateTime--2017年10月31日15:14:12 Author:Marydon js改变css样式 1.js改变单个css样式 HTML部分 <div id="tes ...
- js操作css样式、js的兼容问题
一.js操作css样式 div . style . width="200px" 在div标签内我们添加了一个style属性,并设定width值.这种写法会给标签带来大量的style ...
- 【JS新手教程】JS修改css样式的几种方法
本文试验了几种JS修改css样式的方法,方法1:元素.style.样式=样式值.方法2:元素.style.cssText=样式:样式值方法3:元素.style[样式]=样式值 .cssText这种,可 ...
随机推荐
- Magento模型与ORM基础
参考网址:http://www.ruiwant.com/magento-for-dev-part-5-magento-models-and-orm-basics.html
- codesmith连接postgresql修复bug
转:CodeSmith7代码生成器针对PostgreSQL数据库无法使用的Bug修复全过程 我自己又修改过,完整的PostgreSQLSchemaProvider.cs文件如下 using Npgsq ...
- MySQL Sleep进程
MySQL中查询当前的连接数: mysql> show status like '%Threads_connected%'; +-------------------+-------+ | Va ...
- Android 关于导航栏(虚拟按键)遮挡PopupWindow底部布局的问题
我们自定义popupWindow的时候,一般会设置这些参数 setContentView(contentView); //设置高度为屏幕高度 setWidth(UIUtils.getScreenHei ...
- C语言函数实现的另类方法
在前面看过那个BT的Javascript程序后,我们来看一个C语言的,相信大家还记得输出从1到1000的数最后的那个示例,本站还有很多这样的示例,如:变态的hello word,如何教新手编程,还有恐 ...
- 反射式光电开关QRE1113
The QRE1113 is a small IR reflectance sensor. This sensor is often used in line following robots bec ...
- 目标检测 的标注数据 .xml 转为 tfrecord 的格式用于 TensorFlow 训练
将目标检测 的标注数据 .xml 转为 tfrecord 的格式用于 TensorFlow 训练. import xml.etree.ElementTree as ET import numpy as ...
- MySQL (1366, "Incorrect string value: '\\xF0\\x9F\\x8E\\xAC\\xE5\\x89...' for column 'description' at row 1")
(1366, "Incorrect string value: '\\xF0\\x9F\\x8E\\xAC\\xE5\\x89...' for column 'description' at ...
- ||在oracle数据库中起到字符串拼接的作用
例子:select org.id from org where inner_code like '12011601001' || '%' ||在oracle数据库中起到字符串拼接的作用,上面等同于'1 ...
- 使用 vue-cli 实现组件之间数据交换
1 使用脚手架工具用 webpack 模板初始化项目,用 webstorm 打开项目.src 目录下是要编写的源文件. main.js 文件 是主入口文件, 在es6语法中,:function(){} ...