码迷,mamicode.com
首页 > Web开发 > 详细

html 5 css 选择器

时间:2015-05-11 12:53:57      阅读:142      评论:0      收藏:0      [点我收藏+]

标签:

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>

html 5 css 选择器

标签:

原文地址:http://www.cnblogs.com/xiezefeng/p/4494091.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!