lession02HTML语言基础之文本[1]课件

lession02HTML语言基础之文语言基础之文本本兰晶兰晶lession02HTML语言基础之文本语言基础之文本v启动和退出启动和退出Dreamweaver8单击单击“开始开始”按钮，在开始菜单中依次选择按钮，在开始菜单中依次选择“程序程序”“Macromedia”“Macromedia Dreamweaver8”，启动，启动Dreamweaver8程序。启动程序。启动Dreamweaver8后出现开始界面。后出现开始界面。lession02HTML语言基础之文本语言基础之文本lession02HTML语言基础之文本语言基础之文本v新建网页新建网页菜单栏中菜单栏中“文件文件”|“新建新建”命令命令|标准工具栏上的标准工具栏上的 按钮按钮“新建文档新建文档”对话框中选择对话框中选择“基本页基本页”选项中的选项中的“HTML”v保存网页保存网页 菜单栏中菜单栏中“文件文件”|“保存保存”|标准工具栏上的标准工具栏上的 按钮按钮v关闭网页关闭网页 菜单栏中菜单栏中“文件文件”|“关闭关闭”|单击文档的窗口右上角的单击文档的窗口右上角的“”v打开网页打开网页 菜单栏中的菜单栏中的“文件文件”|“打开打开”|选中文件拖拽到选中文件拖拽到DW中的标中的标签栏签栏v预览网页预览网页菜单栏中菜单栏中“文件文件”|“在浏览器中预览在浏览器中预览”|“Iexplore 6.0”使用快捷键为使用快捷键为F12在文档工具栏中单击，选择在浏览器中预览在文档工具栏中单击，选择在浏览器中预览lession02HTML语言基础之文本语言基础之文本v空格空格 ctrl+shift+spacev硬回车硬回车 enterv软回车软回车 shift +enterlession02HTML语言基础之文本语言基础之文本P28 图图2.6请使用请使用DW编辑出这个故事编辑出这个故事v新建一个页面新建一个页面v保存这个页面保存这个页面v设置页面的标题设置页面的标题v段落要分隔段落要分隔v首行要空两个汉字的距离首行要空两个汉字的距离lession02HTMlession02HTML L语言基础之文语言基础之文语言基础之文语言基础之文本本本本HTML（Hyper Text Markup Language）又称超文本标）又称超文本标识语言，是一种标识性的语言，是网页设计的最初语言。文件识语言，是一种标识性的语言，是网页设计的最初语言。文件的扩展名的扩展名:“html”或或“htm”。简单的简单的HTML文档文档 你好！你好！Hi,大家好！大家好！HTML简介简介1 1围堵标记围堵标记 格式：格式：2 2单标记单标记格式：格式：只有起始标记，没有结束标记。只有起始标记，没有结束标记。3 3标记属性标记属性格式：格式：各属性间无前后顺序，属性也可省略，当省略属性时取标记的默认值。各属性间无前后顺序，属性也可省略，当省略属性时取标记的默认值。完整的完整的HTML1.标记标记 放在放在“”内内2.页面内容页面内容 要放入页面内的文本、图像、多媒体文件等要放入页面内的文本、图像、多媒体文件等HTML文档的基本结构：文档的基本结构：文件开始文件开始标头区开始标头区开始.标题区标题区标头区结束标头区结束文件主体内容开始文件主体内容开始文件主体内容文件主体内容文件主体内容结束文件主体内容结束文件结束文件结束其中其中之间表示这是个网页文件，是必有的标记。之间表示这是个网页文件，是必有的标记。HTMLHTML语法结构语法结构人人头头头头躯干躯干 姓名姓名lession02HTML语言基础之文本语言基础之文本v一个标签必须是嵌套在另一个标签内使用的。一个标签必须是嵌套在另一个标签内使用的。v大小括号原则大小括号原则 P18lession02HTML语言基础之文本v请试着写出一个标准的请试着写出一个标准的html文件，其文件的标头为自己的名字，内容为文件，其文件的标头为自己的名字，内容为自己的爱好。自己的爱好。Tom My name is Tom.I like lession02HTMLlession02HTML语言基础之文本语言基础之文本v空格的空格的HTML码为码为 lession02HTML语言基础之文本语言基础之文本v段落标记有两种：段落标记有两种：和和v相当于是软回车，相当于是软回车，相当于是硬回车，一个相当于是硬回车，一个相当于是两个相当于是两个v标记的属性中须掌握的是标记的属性中须掌握的是 align 属性属性,有三个有三个 left/right/center 例如：例如：文字文字 lession02HTML语言基础之文本语言基础之文本P28 图图2.6请使用记事本编辑出这个故事的请使用记事本编辑出这个故事的html页面页面v设置页面的标题设置页面的标题v段落要分隔段落要分隔v首行要空两个汉字的距离首行要空两个汉字的距离lession02HTML语言基础之文本语言基础之文本lession02HTML语言基础之文本语言基础之文本v要求在要求在DW中制作中制作游子吟游子吟的页面：的页面：设置标题文字大小及颜色设置标题文字大小及颜色v诗文题目为诗文题目为“标题一标题一”v作者信息为作者信息为“标题三标题三”v作者姓名为斜体作者姓名为斜体文本居中文本居中换行换行游子吟游子吟作者：作者：孟郊孟郊 慈母手中线，游子身上衣。慈母手中线，游子身上衣。临行密密缝，意恐迟迟归。临行密密缝，意恐迟迟归。谁言寸草心，报得三春晖。谁言寸草心，报得三春晖。lession02HTML语言基础之文本语言基础之文本粗体粗体.请试着写出斜体请试着写出斜体 我是粗体我是粗体 的的HTML源码，若下划线的标记是源码，若下划线的标记是u,则请试着则请试着写出写出 我是下划线我是下划线 的的HTML源码源码我是粗体我是粗体我是粗体我是粗体 我是下划线我是下划线lession02HTML语言基础之文本语言基础之文本斜体斜体.请试着写出斜体请试着写出斜体 我是斜体我是斜体 的的HTML源码源码我是斜体我是斜体我是斜体我是斜体 标题显示等级标题显示等级语法格式为：语法格式为：n：表示不同级别的标题，：表示不同级别的标题，n值可以是值可以是1-6中的任意数字，其中的任意数字，其中中1表示的标题字体最大。表示的标题字体最大。可以用可以用align属性设置对齐方式，常用的有左对齐，居中，右属性设置对齐方式，常用的有左对齐，居中，右对齐三种对齐方式。对齐三种对齐方式。lession02HTML语言基础之文本lession02HTML语言基础之文本语言基础之文本v要求在记事本中制作出页面：要求在记事本中制作出页面：设置标题文字大小及颜色设置标题文字大小及颜色v诗文题目为诗文题目为“标题一标题一”v作者信息为作者信息为“标题三标题三”v作者姓名为斜体作者姓名为斜体文本居中文本居中换行换行游子吟游子吟作者：作者：孟郊孟郊 慈母手中线，游子身上衣。慈母手中线，游子身上衣。临行密密缝，意恐迟迟归。临行密密缝，意恐迟迟归。谁言寸草心，报得三春晖。谁言寸草心，报得三春晖。lession02HTML语言基础之文本语言基础之文本字体标记字体标记Size：设置字体的显示字号，范围是从：设置字体的显示字号，范围是从“17”，其中，其中“3”是默认值。是默认值。Color：设置文本的颜色，值可以是颜色名（英文如：设置文本的颜色，值可以是颜色名（英文如red代表红色）或代表红色）或颜色的十六进制代码（颜色的十六进制代码（#000000代表黑色，代表黑色，#FFFFFF代表白色）。代表白色）。Face：设置文本显示的字体，值为字体的名称。：设置文本显示的字体，值为字体的名称。例：例：红色红色 PS:HTML 5 中不支持。中不支持。lession02HTML语言基础之文本语言基础之文本lession02HTML语言基础之文本语言基础之文本特殊字符特殊字符(P42 表表3-2)HTML中除了我们上面学的的一些标记外，还有一些我们常用的特殊字符比如中除了我们上面学的的一些标记外，还有一些我们常用的特殊字符比如“”，这些特殊字符在，这些特殊字符在HTML语言中都有对的转义符，常用的转义符与特殊字符参语言中都有对的转义符，常用的转义符与特殊字符参见下表：见下表：HTML 代码代码显示结果显示结果说明说明<大于号或显示标记大于号或显示标记&&可用于显示其它特殊字符可用于显示其它特殊字符"引号引号®注册注册©版权版权™商标商标 不断行的空格不断行的空格lession02HTML语言基础之文本语言基础之文本上标与下标上标与下标上标上标.下标下标请试着写出请试着写出(1)我是最新消息我是最新消息new其中其中new要求为红色且为粗斜体要求为红色且为粗斜体(2)a1+a2=b1 的的HTML源码源码我是最新消息我是最新消息new a1+a2=b1 lession02HTML语言基础之文本语言基础之文本v请在上一个练习的基础上写出作者朝请在上一个练习的基础上写出作者朝代的代的HTML源码：源码：朝代为蓝色上标朝代为蓝色上标游子吟游子吟作者：作者：孟郊孟郊 (唐唐)慈母手中线，游子身上衣。慈母手中线，游子身上衣。临行密密缝，意恐迟迟归。临行密密缝，意恐迟迟归。谁言寸草心，报得三春晖。谁言寸草心，报得三春晖。水平线标记水平线标记水平线是在网页上划出一条水平的分割线，用水平线是在网页上划出一条水平的分割线，用来标记水来标记水平线。语法格式为：平线。语法格式为：Size：设置水平线的高度，以像素为单位。：设置水平线的高度，以像素为单位。Color：设置水平线的颜色。：设置水平线的颜色。Width：设置水平线的宽度，单位是像素或百分比，像素是绝对大小，不：设置水平线的宽度，单位是像素或百分比，像素是绝对大小，不会随着程序窗口的大小而改，百分比是相对于程序窗口水平线所占的比例，会会随着程序窗口的大小而改，百分比是相对于程序窗口水平线所占的比例，会随着程序窗口的大小而改变。随着程序窗口的大小而改变。Align：设置水平线的对齐方式。对齐方式有左对齐，居中，右对齐三种。：设置水平线的对齐方式。对齐方式有左对齐，居中，右对齐三种。lession02HTML语言基础之文本语言基础之文本lession02HTML语言基础之文本在在HTML中，列表常用的有中，列表常用的有“有序列表有序列表”和和“无序列表无序列表”。lession02HTML语言基础之文本1有序列表有序列表基本语法结构为：基本语法结构为：项目1项目2项目ntype=“1”type=“a”type=“A”type=“i”type=“I”Start 表示起始的数值表示起始的数值2无序列表无序列表基本语法结构为：基本语法结构为：项目1项目2项目nType:设置符号形状，有实心圆、小正方形、空心圆三种，具设置符号形状，有实心圆、小正方形、空心圆三种，具体如下：体如下：type=“disk”符号为实心圆。符号为实心圆。（默认为（默认为disk）type=“square”符号为正方形。符号为正方形。type=“circle”符号为空心圆。符号为空心圆。lession02HTML语言基础之文本语言基础之文本P49 制作一则通知制作一则通知v会议标题为会议标题为2号标题号标题v项目使用无序列表项目使用无序列表v落款为右对齐落款为右对齐v页面字体大小设为页面字体大小设为14px