选择器

1.初识css
2.块级元素和行内元素
3.css核心内容
 3.1 标准流
 3.2 盒子模型
 3.3 浮动
 3.4 定位
4.css综合案例
 4.1 盒子模型经典案例
 4.2 仿sohu首页面布局
 4.3 可爱屋网站首页面
掌握css的基本用法
掌握css的四种选择器用法
请看一个问题

 案例[HtmlPage1.htm]
 这是一个栏目风格不同的页面,
如果,我希望统一设置它们的样式
该怎么办?

解决之道-css

 对案例[HtmlPage1.htm]，进行
改造，使用css来统一设置所有栏目
的样式。 

请再思考一个问题

  汶川大地震时,所有的网站的图片,都变成黑白的了,这个是怎么实
现的呢?

  案例[HTMLPage2.htm]这里用到了滤镜技术.

选择器  
选择器是css中非常重要的概念.css中有四种不同的选择器
   ①类选择器，又叫class选择器
   ②id选择器
   ③html元素选择器
   ④通配符选择器
   简单的说,选择器就是在css中创建，而在网页页面(html,jsp,php
,asp.net)中使用。

类选择器 
我们在HtmlPage1.html就使用到了类选择器,这里再给大家举一
个例子:  [HTMLPage.htm]

通配符选择器

  如果希望所有的元素都符合某一种样式，可以使用通配符选择器。
选择器深入探讨

  我前面讲的都非常简单,实际上css的选择器使用还有很多您需要注意的
地方，如果不注意根本就不能驾驭css

    ①父子选择器

    请大家看一个图:  [HTMLPage.htm]   

     如果希望特别强调非常两个字,该
     如何处理?方案:
     a.id选择器
     b.class选择器
     c.父子选择器
选择器深入探讨

  ①父子选择器

     类选择器和id选择器都可以有父子选择器.
选择器深入探讨

  ②一个元素可以同时有id选择器和类选择器
   请看一个案例:

                  要实现新闻1 和其它的新闻
                  样式不 一样,这怎么实现
选择器深入探讨

  ③一个元素可以同时有id选择器和类选择器
   当id选择器和类选择器发生冲突时,id选择器优先级 高于类选择
器.
 
   优先级: id选择器 > 类选择器
   比如: id选择器指定字体为红色,而类选择器指定字体和蓝色，则
页面显示红色.

选择器深入探讨

  ④一个元素最多有一个id选择器,但是可以有多个类选择器

   请看一个案例:

              要实现新闻3 有下划线并是斜体该
            怎么实现?
            方案: a.id选择器 b.类选择器

☞ 当一个元素被多个类选择器修饰时，它们用空格隔开..
选择器深入探讨

    ⑤一个元素最多有一个id选择器,但是可以有多个类选择器，当类
选择器发生冲突的时候，又以哪个为准呢? 我们用一个案例来说明.

选择器深入探讨

  ⑥当一个元素被id选择器,类选择器,html选择器同时限定时，优先
级是: id选择器>类选择器>html选择器>通配符选择器.

选择器深入探讨

  ⑦在css文件中，如果有多个类/id选择器它们都有相同的部分，我
们可以把相同的css样式放在一起,见案例。

教程需要搭配视频观看，请下载。