如何使用JS来改变CSS样式
2019独角兽企业重金招聘Python工程师标准>>>
方法:
document.getElementById("xx").style.xxx中的所有属性是什么
盒子标签和属性对照 | |
---|---|
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://my.oschina.net/nyniuch/blog/77937
如何使用JS来改变CSS样式相关推荐
- 如何通过js改变css样式,如何通过JS 动态改变CSS样式
如何通过JS 动态改变CSS样式0 豆豆dou...2013.09.15浏览640次分享举报 .TLIWREGION3CSS { position:absolute; left:32px; top:4 ...
- js动态改变css样式
动态改变页面元素样式: 使用getElement系列方法访问元素. 改变样式属性:style属性:className属性. <!DOCTYPE html> <html>< ...
- 用js动态改变css样式表(亲测可以)
一.对于响应式布局可以使用@media与@media screen(媒体查询)进行响应式布局. 二.对于非响应式页面可以采用以下方法: 用setAttribute方法实现一个页面两份样式表 ...
- 重学前端第一阶段完 钢琴项目(document.querySelector js改变css样式的3种方式 思路 成品)
菜鸟学完之后,总是感觉学了也还是不会,主要就是因为没有实践,不知道自己到底哪里有问题!虽然说我还没复习完,前端很大一部分都处于模糊阶段,但是感觉还是应该先尽力做一个简单的东西,把这几天学的都用进去,遇 ...
- js基础总结——js 获取元素节点、js 绑定onclick事件、js 获取属性 修改属性值、js 获取子元素、js 改变css样式
参考书籍:<JavaScript DOM编程艺术 第2版> 本博客代码的测试页面是:https://www.layui.com/ js dom操作 js 获取元素节点 一份document ...
- js函数改变html样式,js可以改css样式吗?
js可以改css样式.在很多情况下,都需要对网页上元素的样式进行动态的修改:而JavaScript可以动态的修改样式.下面本篇文章就来给大家介绍几种JavaScript中修改CSS样式的方法,希望对大 ...
- js如何修改html样式,怎么用js改变css样式?
怎么用js改变css样式?下面本篇文章给大家介绍一下使用JavaScript改变css样式的方法.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 怎么用js改变css样式? 1.通过 ...
- JS行间改变css的方法,js改变css样式的三种方法推荐
共用代码: this is a div var div=document.getElementById('div'); 第一种:用cssText div.style.cssText='width:25 ...
- js函数改变html样式,JavaScript改变CSS样式的方法汇总
JavaScript允许你即时的改变CSS样式,这样就可以将用户的眼球吸引到你想他们关注的地方上,并且提供较好的交互体验给力 . JavaScript修改CSS有4种方法: 修改节点style(内联样 ...
- javascript鼠标点击实现改变CSS样式
javascript通过改变元素class名达到间接改变CSS样式 CSS: /* 字体链接样式 */ td.firstLevelMenuClass a:link {color: #3E8BAC; t ...
最新文章
- Codeforces Round #650 (Div. 3)(A-F1)题解
- 使用android SDk帮助文档(英文) 下载中文SDK帮助文档(中文)
- 批量添加AD账号(三)
- iOS之深入解析malloc的底层原理
- how is Bean object created
- Quick cocos2dx-Lua(V3.3R1)学习笔记(十)-----搭建安卓打包环境,用官方示例anysdk生成apk运行...
- IE8“开发人员工具”(下)
- Spring Security Oauth2 (三) 密码码模式
- 实验吧_Guess Next SessionOnce More(代码审计)
- Let’ s Encrypt 现支持通配符的 HTTPS 认证
- 深度学习必备的几款流行网络与数据集
- DSP之有限字长效应
- 卷积网络虽动人,胶囊网络更传“神”
- 《请君入瓮——APT攻防指南之兵不厌诈》目录—导读
- C语言实现俄罗斯方块
- 如何在java中把两个PDF拼接到一个
- “华为电气—艾默生”系——成就A股最多上市公司的创业群体
- Unity人物动画问题
- 西门子s7 计算机通讯,西门子S7-200使用Modbus协议(最全解析)
- 量化投资学习——资产组合理论(Portfolio Theory)
热门文章
- 算法萌新如何学好动态规划(三)
- 当 p<1时,p 范数不满足三角不等式的证明 | p norm | triangle inequality
- 笔记本计算机外壳的制作过程,笔记本电脑外壳选材不可小视
- CamRaptor:针对DVR摄像头的漏洞利用工具
- 蓝队应对攻击的常用策略二
- 神经网络与深度学习第3章:线性模型 阅读提问
- 计算机基础第五章知识,计算机基础第5次作业-第五章-Powerpoint知识题
- service mysqld restart 报错 Redirecting to /bin/systemctl restart mysqld.service
- 2019.03.30 图解HTTP
- ES6数组知识点,巧妙运用数组,对循环说88