css基础知识幻灯片.pptVIP

样式表的概念 CSS(Cascading Style Sheet),中文译为层叠样式表，它是用于控制网页样式并允许将样式信息和网页内容分离的一种标记性语言。 CSS是1996年由W3C审核通过，并且推荐使用的。简单的说，CSS的引入就是为了使HTML语言更好地适应页面的美工设计。它以HTML为基础，提供了更丰富的格式化功能，如字体、颜色、背景和整体排版等。 CSS的特点 CSS的最大特点就是将内容和格式分离。（以.css为扩展名存储一个独立的文件）。利用CSS网站开发人员可以在HTML文档中安排内容，在另一份样式文档设计这些内容的显示方式，比如字体颜色、字体大小、行距等。 使用CSS可大大缩减页面代码，提高页面浏览速度；使文档结构清晰，缩短改版时间；强大字体控制和排版能力，容易编写，可以像写HTML代码一样轻松编写CSS；可以将许多网页的风格格式同时更新，可将站点上网页风格都使用一个CSS文件进行控制。 重要概念 元素 在HTML文档中，元素是指表示文档格式的一个模块，它包括一个开始标签、一个结束标签（有些结束标签可以省略，如hr）和包含在这两个标签里的所有内容。我们把标签名作为元素的名称。 例如：p欢迎/p 父元素/子元素 若元素A的开始标签和结束标签之间包含其它元素B，则元素A称为元素B的父元素，反之元素B为元素A的子元素。 例如：p欢迎hr/p 属性 在HTML文档中属性是指某个元素某方面的特性，比如颜色、字体大小、高度、宽度等。对于每个属性能且仅能指定一个值。 例如：颜色为红色、字体大小为20磅。 规则 一个CSS样式表是由许多样式规则组成的，其规则为： 选择符{属性1：值对1；属性2：值对2；……} 规则是一系列“属性：值对”的集合，它用来控制网页元素的显示方式。根据规则中对属性的设定，浏览器会按照设定的值来显示标签内的内容。 CSS的基本写法 基本写法 一个规则包括一个选择符，以及紧跟其后的一系列属性：值对，所有属性：值对用“{}”包括，各属性：值对之间用分号“；”分隔。 例如：p{color：red；font-size：20pt} 如果选择符使用HTML语言中的标签名，称本规则为重置定义，也就是说重新定义了某些标签的显示样式。 多个选择符 当对大量标签作重复性设定时，比如将h1到h6的6级标题都设为红色时，可以按如下规则书写： h1{color：red} h2{color：red} h3{color：red} h4{color：red} h5{color：red} h6{color：red} 简单写法： h1，h2，h3，h4，h5，h6{color：red} html headtitle简单的样式表/title style type=text/css !-- h1{ color:blue;font-size:40px;font-family:华文新魏} p{ background:yellow; color:blue; font-size:25px;font-family:隶书} -- /style /head body bgcolor=lightgreen center h1样式表/h1 p这是一个简单的样式表/p /center /body /html CSS的类型 有三种方法可以将CSS和HTML标签结合起来：内联样式表、文档级样式表和外部样式表。 内联样式是给某一个元素设定具体的样式规则 文档级样式的作用范围是整个文档 外部样式的作用范围是所有引用或链接它的html文档 CSS样式表的引入 内联样式表 内联样式是连接样式和标签的最简便的方法，只需要在标签中包含一个名为style的属性及其值即可。其中style属性和它的值之间用“=”连接，其值是一串字符，该字符是一个规则的简写，它只省略了规则的选择符和“{ }”,剩下的属性:值对则描述了具体的显示样式，浏览器会根据样式的属性及其值来显示标签中的内容。 语法： h2 style=“color:red;font- size:20pt;font- style:italic” 　　 欢迎光临 /h2 　 二级标题红色，20磅大小，斜体。 文档级样式表 内联样式表只是将样式规则加在某一标签内部，其影响范围仅限于该标签，而文档级样式表则将所有规则罗列在文档的开头，它可以影响整篇文档。文档