第一章 HTML+DIV+CSS基础知识

主讲老师：朱朝兵  QQ：537060756

CSS层叠样式表

视频教程

高清版下载

http://pan.baidu.com/s/1jGslH2m

教程截图

（1）css样式简介

CSS的英文全称是“cascading style sheets”中文译为“层叠样式表”也可译为“串联式样式表”，利用他们可以对网页中的文本进行精确的格式化控制。Css样式可以控制多个范围内的文本格式，而且还可以控制多个文档中的文本格式。网页制作时采用css技术可以有效地对页面的布局、字体、颜色、背景和其他效果实现更加精准的控制。

（2）定义css样式表

（a）用HTML标记定义

使用HTML的style组件，并将这个元素放置于head部分，包含网页的样式规则，每个规则包含一个选择符（通常是一个HTML元素），如body、p等。

样式规则如下：

选择符{属性：值}

单一的选择符使用多个样式时应用（；）隔开。如

选择符{属性1：值1；属性2：值2；属性3：值3}

综合实例（定义H1/H2的颜色和字体大小）：

    
        


     

这是H1
这是H2

（b）Class类别选择符

Class属性用于指定元素属于何种样式的类，类表示方法（.类名称）。

例如样式表可以加入title类：

 .title{color：red；font-size：24px；}

在这个例子中titie类可以用于任何body元素，因为它在样式表中没有与任何HTML元素与之关联。

综合实例：

    
        


     

这是一个标题,他现在运用了.title类的样式
这是一个内容，他现在运用了.neirong类的样式

（c）Id选择符

Id和class一样用于指定元素属于何种样式的类，类表示方法（#类名称）。

例如样式表可以加入weiyi类：

#weiyi{color：red；font-size：24px；}

在这个例子中weiyi类可以用于body元素中的一个元素。

在同一个层中可以同时运用class和id，但是id的级别要高于class，也就是说他们同时包含了一个样式时，将会优先选择id中的样式进行显示。

综合实例：

    
        


     

这是一个标题,他现在运用了.title类的样式
这是一个内容，他现在运用了.neirong类的样式

感谢您的收看

本教程由DZ起点网为您录制  版权所有！

dz模板制作交流群：253092987