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

第四章 CSS选择器

时间:2015-03-17 19:28:39      阅读:272      评论:0      收藏:0      [点我收藏+]

标签:

所有HTML语言中的标记都是通过不同的CSS选择器进行控制的。用户只需要通过选择器对不同的HTML标签进行控制,并赋予各种样式声明,即可实现各种效果。

1、标记选择器

一个HTML页面有很多不同的标记组成,而CSS标记选择器就是声明哪些标记采用哪种CSS样式。例如P选择器,就是用于声明页面中所有<p>标记的样式风格。

CSS代码声明了HTML页面中所有的<h1>标记,文字的颜色都采用红色,大小都为25px。

 

<style>
h1{
    color:red;
    font-size:25px;
}
</style>

每一个CSS选择器都包含了选择器本身、属性和值,其中属性和值可以设置多个,从而实现对同一个标记,声明多种样式风格。
技术分享

CSS语言对于所有属性和值都有相对严格的要求,如果声明的属性在CSS规范中没有,或者某个属性的值不符合该属性的要求,都不能使该CSS语句生效。通常情况下可以直接利用CSS编辑器的语法提示功能避免,但某些时候还需要查阅CSS手册或者直接登录W3C的官方网站(http://www.w3.org/)来查阅CSS的详细规格说明。

 

2、类别选择器

类别选择器的名称可以由用户自定义,属性和值跟标记选择器一样,也必须符合CSS规范。

技术分享

当页面中同时出现3个<p>标记,并且希望它们的颜色各不相同,就可以通过设置不同的class选择器来实现。

<html>
<head>
<title>class选择器</title>
<style type="text/css">
<!--
.one{
    color:red;      /*红色*/
    font-size:18px;     /* 文字大小*/
}
.two{
    color:green;
    font-size:20px;
}
.three{
    color:cyan;
    font-size:22px;
}
-->
</style>
</head>
<body>
    <p class="one">class选择器1</p>
    <p class="two">class选择器2</p>
    <p class="three">class选择器3</p>
    <h3 class="two">h3同样适用</h3>
</body>
</html>           

 

第四章 CSS选择器

标签:

原文地址:http://www.cnblogs.com/Cassiel-685/p/4344896.html

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