基本选择器是使用最频繁,最基础,最早定义的选择器

基本选择器是使用最频繁,最基础,最早定义的选择器。IE,火狐,Chrome,Safari,Opera均兼容。主要包括如表3-1所示几种类型基本选择器。

表3-1  基本选择器                       

 

选择符

 
 

  

 
 

功能描述

 
 

*

 
 

通配选择器

 
 

选择所有HTML元素

 
 

E

 
 

元素选择器

 
 

选择指定的类型的HTML元素

 
 

#id

 
 

ID选择器

 
 

选择制定ID属性值为“id”的任意类型元素

 
 

.class

 
 

类选择器

 
 

选择指定class属性值为“class”的任意类型的任意多个元素

 
 

Selector,SelectorN

 
 

分组选择器

 
 

将每一个选择器匹配的元素集合并

 

备注"CSS"列指示该属性是在哪个 CSS 版本中定义的。(CSS1CSS2 还是 CSS3。)

1.CSS 元素选择器

最常见的 CSS 选择器是元素选择器。换句话说,文档的元素就是最基本的选择器。如果设置 HTML的样式,选择器通常将是某个 HTML 元素,比如 p、h1、em、a,甚至可以是 html 本身。

 

html {color:black;}

 

h1 {color:blue;}

 

h2 {color:silver;}

 

2. CSS的id 选择器

id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。id 选择器以 "#" 来定义。下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二个定义元素的颜色为绿色:

 

#red {color:red;}

 

#green {color:green;}

 

下面的 HTML 代码中,id 属性为 red的 p 元素显示为红色,而 id 属性为 green 的 p 元素显示为绿色。 

 

<p id="red">这个段落是红色。</p>

 

<p id="green">这个段落是绿色。</p>

 

3. CSS 类选择器

类选择器允许以一种独立于文档元素的方式来指定样式。该选择器可以单独使用,也可以与其他元素结合使用。在使用类选择器之前,需要修改具体的文档标记,以便类选择器正常工作。为了将类选择器的样式与元素关联,必须将 class 指定为一个适当的值。请看下面的 HTML 代码

 

<h1>

 

This heading is very important.

 

</h1>

 

<p>

 

This paragraph is very important.

 

</p>

 

在上面的代码中,两个元素的 class 都指定为 important:第一个标题( h1 元素),第二个段落(p 元素)。然后我们使用以下语法向这些归类的元素应用样式,即类名前有一个点号(.)。

 

 

.important {color:red;}

 


Powered By 主机

 Theme By 服务器

Copyright 六六互联.Some Rights Reserved.www.ic.vip