<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>基本选择器</title>
<script src="js/jquery.js"></script>
<style>
.astyle{
font-size: 28px;
color: red;
}
.bstyle{
font-size: 40px;
color: orangered;
text-decoration: none;
}
</style>
<script type="text/javascript">
$(function(){
//页面加载完成执行里面的函数
//所有元素选择器
//$("*").css("border","1px solid red");
//类选择器
//$(".astyle").css("border","1px solid red");
//元素选择器
//$("div").css("border","1px solid red");
//id选择器
$("#li3").css("border","1px solid red");
//组合选择器 方法 $("selector1","selector2",.......)
$("#li4","#a7",".astyle").css("border", "1px solid red");
});
</script>
</head>
<body>
<div>
<li><a herf="#">超链接1</a></li>
<li><a herf="#">超链接2</a></li>
<li id="li3"><a herf="#">超链接3</a></li>
<li id ="li4"><a herf="#" class="astyle">超链接4</a></li>
<li><a herf="#">超链接5</a></li>
<li><a herf="#">超链接6</a></li>
<li><a id="a7" herf="#" class="bstyle">超链接7</a></li>
</div>
</body>
</html>