批改状态:未批改
老师批语:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>4.设置元素的类样式</title>
<style type="text/css">
.circle {border-radius: 50%;}
.shadow {box-shadow: 3px 3px 3px #888}
</style>
</head>
<body>
<img src="./images/cyx.jpg" width="200" id="pic">
</body>
</html>
<script type="text/javascript" src="./js/jquery-3.3.1.js"></script>
<script type="text/javascript">
//设置元素的类样式
//1.设置元素标签的class属性:
//2.直接设置标签的style属性:内敛样式
//
//1.addClass()
// $('#pic').addClass('circle')
// $('#pic').addClass('shadow')
// $('#pic').addClass('circle shadow')
//2.removeClass()
// $('#pic').removeClass('circle')
// $('#pic').removeClass('shadow')
// $('#pic').removeClass('circle shadow')
//3.样式的自动切换:toggleClass()
//如果当前元素没有改样式,就自动执行添加操作,如果有,就自动执行删除操作
$('#pic').toggleClass('circle shadow')
</script>点击 "运行实例" 按钮查看在线实例
作业地址:http://mi-888.com/PHP/zuoye/20180404/4.html
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号