<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>增加css样式</title>
<script type="text/javascript" src="class library/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function(){
$('#head').mouseover(function(){
$('#content').addClass('f_style');
}).mouseout(function(){
$('#content').removeClass('f_style');
});
});
</script>
<style>
#head{
width:500px;
height:30px;
margin:0 auto;
text-align:center;
}
#content{
color:blue;
font-size:20px;
border:1px solid #ccc;
width:500px;
height:300px;
margin:0 auto;
}
.f_style{
font-weight:bold;
line-height:200%;
}
</style>
</head>
<body>
<p id="head">请点我</p>
<div id="content">
1,首先把jQuery导入.
2,然后开始写函数了。$(document).ready(function(){});
3,获取标签能直接 $("标签")。给标签注册onclick事件直接可以 click.
4,核心代码:
$("#head").click(function(){$(".content").addClass("c_style");});
5,功能:通过单击id为control的元素改变id为box元素的样式
知识点:addClass()添加样式
</div>
</body>
</html>
增加css样式--详细版
最新推荐文章于 2024-04-12 10:21:35 发布