<head> ……
<title>使用CSS内嵌式</title> <style type="text/css">
h2{ text-align:center;}
/*定义标题标记居中对齐*/
p{ font-size:16px; color:red; text-decoration:underline;}
</head> <body> <h2 style="font-size:20px; color:red;">使用CSS行内式修饰二级标题的
字体大小和颜色</h2> </body>
</html>
运行例程代码，得到效果如图3-1所示。
图3-1 使用CSS行内式
2．内嵌式 内嵌Байду номын сангаас是将CSS代码集中写在HTML文档的<head>头部标记中，
一、CSS样式规则的重要性 使用HTML时，需要遵从一定的规范。CSS亦如此，要想熟练地 使用CSS对网页进行修饰，首先需要了解CSS样式规则，具体格式如下：
选择器{属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}
在上面的样式规则中，选择器用于指定CSS样式作用的HTML对象， 花括号内是对该对象设置的具体样式。其中，属性和属性值以“键值 对”的形式出现，属性是对指定的对象设置的样式属性，例如字体大 小、文本颜色等。
<head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <meta name="keywords" content="关键字1,关键字2" />
<meta name="description" content="网页的描述" /> <title>使用CSS行内式</title>
并且用<style>标记定义，其基本语法格式如下：
…… <head>
<style type="text/css"> 选择器 {属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}
</style> </head> ……
该语法中，<style>标记一般位于<head>标记中<title>标记之后， 也可以把它放在HTML文档的任何地方。但是由于浏览器是从上到下 解析代码的，把CSS代码放在头部便于提前被下载和解析，以避免网 页内容下载后没有样式修饰带来的尴尬。
（1）对网页文档的基本操作 （2）在网页中输入文字、编辑文本和设置文本属性 （3）在网页中输入空格和文本换行 （4）在网页中插入图像、设置图像属性
（1）在网页中插入特殊字符、插入水平线、注释和换行 （2）在网页中插入图像、设置图像属性
任务驱动法、分组讨论法
3.1 掌握CSS样式规则、CSS样式表的引入方式 3.1.1 CSS样式规则
工业和信息化“十三五”高职高专人才培养规划教材
汤智华 主编 王爱红 主审
【教学导航】
教学目标
本单元重点 本单元难点
教学方法
（1）学会建立站点目录结构 （2）熟悉使用骨架创建和保存网页文档等基本操作 （3）掌握在网页中输入文字、编辑文本、设置文本属性的操作方法 （4）掌握在网页中输入空格和文本换行的操作方法 （5）掌握在网页中插入特殊字符、水平线、注释和换行的操作方法 （6）掌握在网页中插入图像、设置图像属性的方法 （7）掌握制作图文混排网页的技巧 （8）熟悉HTML的基本结构
3．链入式
链入式是将所有的样式放在一个或多个以.css为扩展名的外部样 式表文件中，通过<link />标记将外部样式表文件链接到HTML文档中， 其基本语法格式如下：
• 多个属性之间必须用英文状态下的分号隔开，最后一个属性后的分号 可以省略，但是，为了便于增加新样式最好保留。
• 如果属性的值由多个单词组成且中间包含空格，则必须为这个属性值 加上英文状态下的引号。
• 在编写CSS代码时，为了提高代码的可读性，通常会加上CSS注释。
3.1.2 引入CSS样式表的方式
接下来通过一个案例来学习如何在HTML文档中使用内嵌式CSS 样式，具体代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"> <html>
属性和属性值之间用英文“:”连接，多个“键值对”之间用英文 “;”进行区分。
所谓键值对，就是可以根据一个键值获得对应的一个值。键值对 跟数学中的“一对一”映射关系是一个意思。
二、书写CSS样式时需要注意的问题
书写CSS样式时，除了要遵循CSS样式规则，还必须注意几个问题， 具体如下。
• CSS样式中的选择器严格区分大小写，属性和值不区分大小写，按照 书写习惯一般将“选择器、属性和值”都采用小写的方式。
该语法中style是标记的属性，实际上任何HTML标记都拥有style属 性，用来设置行内式。
其中属性和值的书写规范与CSS样式规则相同，行内式只对其所在 的标记及嵌套在其中的子标记起作用。
接下来通过一个案例来学习如何在HTML文档中使用行内式CSS 样式，具体代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"> <html>
一、引入CSS样式表的重要性 要想使用CSS修饰网页，就需要在HTML文档中引入CSS样式表。 二、引入CSS样式表的方式 CSS提供了4种引入方式，具体如下。 1．行内式 行内式也称为内联样式，是通过标记的style属性来设置元素的样 式，其基本语法格式如下：
<标记名 style="属性1:属性值1; 属性2:属性值2; 属性3:属性值3; "> 内容 </标记名>
/*定义段落标记的样式*/
</style>
</head>
<body>
<h2>内嵌式CSS样式</h2>
<p>使用style标记可定义内嵌式CSS样式表，style标记一般位于head头部 标记中，title标记之后。</p>
</body>
</html>
运行例程代码，得到效果如图3-2所示。
图3-2 使用CSS内嵌式
