您的位置:首页 > Web前端 > CSS

CSS基础-23选择器-选择器详解(2)

2015-08-02 16:11 661 查看
<!DOCTYPE html>
<!--选择器-选择器详解(2)-->
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link href="css02.css" type="text/css" rel="stylesheet">
<!--<style>-->
<!--<!–简单属性选择器–>-->
<!--/*[title]{*/-->
<!--/*color: blueviolet;*/-->
<!--/*}*/-->
<!--/*根据具体属性值选择*/-->
<!--/*[href="http://www.baidu.com"]{*/-->
<!--/*font-size: 50px;*/-->
<!--/*color: blue;*/-->
<!--/*}*/-->
<!--/*属性选择器 模糊匹配的使用,匹配必须是一个完整单词*/-->
<!--/*[title~="title"] {*/-->
<!--/*font-size: 50px;*/-->
<!--/*color: brown;*/-->
<!--/*}*/-->

<!--</style>-->

</head>
<body>
<!--<p title="">属性选择器</p>-->
<!--<a href="http://www.baidu.com">万能的百度</a>-->
<!--<p title="title hello">属性选择器1</p>="">属性选择器</p>-->
<!--<p title="title hello2">属性选择器2</p>="">属性选择器</p>-->
<!--<p title="title hello3">属性选择器3</p>="">属性选择器</p>-->
<!--后代选择器-->
<!--<p>this is<strong> my <i> dog1 </i> dog2 </strong>title</p>-->
<!--<!–子元素选择器–>-->
<!--<p>this <strong>is my <i> dog1 </i> dog2 my</strong> dog</p>-->
<!--相邻兄弟选择器-->
<div>
<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ul>
</div>

</body>
</html>
css:

/*
id选择器和class选择器的区别:
id选择器只能使用一次,类选择器可多次使用
id选择器不能结合使用
当使用js的时候会用到id;
*/
/*属性选择器*/
/*后代选择器*/
/*p strong i{*/
/*color: blueviolet;*/
/*}*/
/*子元素选择器*/
/*p>strong>i{*/
/*color: blueviolet;*/
/*}*/
/*相邻兄弟选择器*/
li+li{
font-size: 50px;
color: #ffff00;
}

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: