new.css
/*选择器分组*/
h1,h2,h3{
color: orange;
font-size: 21px;
}
h1{
/* 如果值大于1个单词，需要加上引号*/
/* 属性大于1个之后，属性之间用分号隔开*/
font-size: 14px;
color: red;
}
/*继承*/
body{
margin: 110px;
/* font-size: 144px;*/
color: yellow;
}
/*派生标签*/
li strong{
color: blue;
font-size: 44px
}
strong{
color: black
}
/*id 选择器*/
#pid{
color: green;
}
/*<p id="piid"><a>这里面的内容</a></p>*/
/*id 与派生一起用*/
#piid a{
font-size: 31px;
color: gray;
background-color: red;
}
/*类选择器*/
.pclass{
color: red;
background-color: blue;
}
/*类选择器 加 派生选择器配合*/
.pclass a{
font-size: 42px;
color: green
;
background-color: orange;
}
new.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<link href="new.css" type="text/css" rel="stylesheet">
<style type="text/css">
/* 属性选择器*/
[title]{
color:yellow;
}
[title=te]{
color: red;
}
</style>
</head>
<!-- <frameset rows="20%,50%,30%">-->
<!-- <frameset>-->
<!--
rows 从上往下
cols 从左往右
-->
<!-- <frame src="a.html" frameborder="0"></frame>-->
<!-- <frame src="b.html" frameborder="0"></frame>-->
<!--
<frame src="a.html" frameborder="0" width="800px" height="800px"></frame>
</frameset>
-->
<body>
<p id="pid">id p样式</p>
<h1>h1中的内容</h1>
<h2>h2中的内容</h2>
body中的内容
<ul>
<li><strong>li标签下strong</strong></li>
<p id="piid"><a>p中a 派生</a></p>
</ul>
<p class="pclass">pclass</p>
<b class="pclass"><a>p类选择器 a加 派生选择器配合</a></b>
<p title>title属性</p>
<p title="te">title="te"</p>
</body>
</html>