js动态修改整个页面样式达到换肤效果_javascript技巧
程序员文章站
2022-04-24 14:14:41
...
jsPro1\js动态修改整个html页面样式(换肤).html
动态修改页面样式
修改整个页面的样式
jsPro1\css\red.css
* {
margin: 0px;padding: 0px;
}
body {
background-color: #eeeeee;
}
span {
color: red;
}
#txt {
color: #f00;border: 1px solid #7d1515;
}
.btn {
background-color: #a52a2a;border: none;color: white;width: 100px;height: 28px;
}
jsPro1\css\blue.css
* {
margin: 0px;padding: 0px;
}
body {
background-color: #eeeeee;
}
span {
color: blue;
}
#txt {
color: #0000cd;border: 1px solid #006400;
}
.btn {
background-color: #0000cd;border: none;color: white;width: 100px;height: 28px;
}
复制代码 代码如下:
修改整个页面的样式
jsPro1\css\red.css
复制代码 代码如下:
* {
margin: 0px;padding: 0px;
}
body {
background-color: #eeeeee;
}
span {
color: red;
}
#txt {
color: #f00;border: 1px solid #7d1515;
}
.btn {
background-color: #a52a2a;border: none;color: white;width: 100px;height: 28px;
}
jsPro1\css\blue.css
复制代码 代码如下:
* {
margin: 0px;padding: 0px;
}
body {
background-color: #eeeeee;
}
span {
color: blue;
}
#txt {
color: #0000cd;border: 1px solid #006400;
}
.btn {
background-color: #0000cd;border: none;color: white;width: 100px;height: 28px;
}