第4章_CSS快速入门.ppt

第4章 CSS快速入门;4.1 CSS概述 ;4.1.2 CSS的基本语法 ;4.1.3 CSS样式面板;CSS常用的类型有外部样式表和内部样式表两种，行内样式表(内联式样式表)是一种特殊的内部样式表。;内部样式表(嵌入式样式表)：CSS写在head与/head之间，并且用style与/style标签进行声明，例： html xmlns=/1999/xhtml head title欢迎使用CSS样式表/title style type=“text/css” body { font-size:28px; font-style: normal; line-height: 200%; color: #FF3300; text-decoration: underline; } /style /head body CSS样式使用样例，请认真学习！ /body /html;行内样式表(内联式样式表)：直接对XHTML的标签使用style属性，并将CSS代码直接写在其中（一种特殊的内部样式表），如: htmlheadtitle一个简单网页/title/headbody style=font-size:28px; color:#FF3300 各位晚上好!大家辛苦了!/body /html;外部样式表(外部链接式)：CSS样式代码单独编写在一个独立的样式文件中，由网页进行调用。 html xmlns=/1999/xhtml head title欢迎使用CSS样式表/title link href=“yangshi.css” rel=“stylesheet” type=“text/css” / /head body CSS样式使用样例，请认真学习！ /body /html;html xmlns=/1999/xhtml head title欢迎使用CSS样式表/title style type=text/css @import url(style.css); /style /head body CSS样式使用样例，请认真学习！ /body /html;1、标签选择器 HTML中的所有标签均可作为标签选择器 语法格式: HTML标签{属性1:属性值;属性2:属性值;…} ;2、类选择器 能够把相同的元素分类定义成不同的样式 语法格式: .类名{属性1:属性值;属性2:属性值;…} 引用方式: 标签 CLASS=“类名”;html xmlns=/1999/xhtml head meta http-equiv=Content-Type content=text/html; charset=utf-8 / title无标题文档/title style type=text/css .text { font-family: 宋体; font-size: 36px; font-style: italic; color: #0F0; text-decoration: underline; } /style /head body p class=text代写寒暑假作业帮忙介绍帮忙冒充家长/p /body /html;3、ID选择器 在HTML页面中ID参数指定了某一个元素，ID选择器用来对这一单一元素定义单独的样式。 语法格式: #ID名{属性1:属性值;属性2:属性值;…} 引用方式: 标签 ID=“id名”;html xmlns=/1999/xhtml head meta http-equiv=Content-Type content=text/html; charset=utf-8 / title无标题文档/title style type=text/css #text1 { font-family: 华文行楷; font-size: xx-large; font-weight: 100; color: #F00; text-decoration: overline; } /style /head body p id=text1代写寒暑假作业帮忙介绍帮忙冒充家长/p /body /html;4、复合选择器 若要定义影响多个标签、类或ID的复合规则，则可选择“复合内容”选择器。如输入div p，则DIV标签内的所有p元素都将受此规则影响。;复合选择器就是两个或多个基本选择器，通过不同方式连接而成的选择器，主要包括“交集”选择器、“并集”选择器、“后代”选择器。 交集选择器 “交集”复合选择器是由两个选择器直接连接构成，其结果是选中二者各自元素范围的交集。其中第一个必须是标记选择器，第二个必须是类别选择器