使用js控制css样式
js拥有很多强大的功能,这里就说一下它的一个控制css最基础的功能,代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js控制css样式</title>
<script>
window.onload=function(){
//这是入口函数,等css运行完后再运行js
var fbox = document.getElementById("box1");
//这是把css里把id叫做box1的函数提到js里面,进而修改它的样式
fbox.style.width='100px';
fbox.style.height='100px';
fbox.style.backgroundColor='red'
}
</script>
</head>
<body>
<div id="box1">
这是js控制的css样式
</div>
<div">
这是没有js控制的css样式
</div>
</body>
</html>
我上面这个代码就是运用了js来控制css的样式。