《ASP程序设计教程（第二版）》-张景峰-电子教案 第2章Web页面制作基础
第2章 Web页面制作基础,2.1 HTML概述 2.2 HTML文本设计 2.3 加入多媒体与超级链接 2.4 制作表格 2.5 制作表单 2.6 框架结构 2.7 CSS基础,2.1 HTML概述,2.1.1 HTML简介 HTML是（Hyper Text Markup Language，超文本标记语言）的缩写，用来表示网上信息的符号标记语言。 HTML最早源于SGML语言。 HTML语言内容丰富，从功能上大体可分为：文本结构设置、列表建立、文本属性制定、超链接、图片和多媒体插入、对象、表格以及窗体的操作。,2.1 HTML概述,2.1.2 HTML文档的结构 包括HEAD、TITLE、BODY三部分，下面是基本结构： 标题部分 正文部分 ,2.1 HTML概述,2.1.3 HTML标记 1HTML文档标记 格式：标志文件开始和结尾的标记。 2HTML文件头标记 格式：用于包含文件的基本信息。 3HTML文件主体标记 格式：文件主体标记。 注意：与为独立的两个部分，不能互相嵌套。,2.1 HTML概述,2.1.4 常用HTML编辑工具 使用记事本等编辑器在保存文档或者更改文件名时，把文件的扩展名设为.htm或者.html即可，那么这个文件就是一个HTML文档。 为了使设计网页更加的方便，很多公司设计了专用的网页编辑器，像Dreamweaver、FrontPage、CutePage、QuickSite等，是专门用来制作网页的，具有所见即所得的功能。,2.2 HTML文本设计,2.2.1 设置的属性 属性概述： background属性 bgcolor 属性 bgproperties属性 link ，vlink， alink属性 Leftmargin，topmargin属性 Margingwidth，marginheight属性,2.2 HTML文本设计,2.2.2 段落格式化 1. 标题标记 格式： ， 设置各种大小不同标题的标记。 2段落标记 格式：设置段落标记。 3预定格式标记 格式：在浏览器中浏览时，按照文档中预先排好的形式显示内容。,2.2 HTML文本设计,4分区显示标记 格式：分区显示标记。 5词标记 格式： 功能：强制换行。 格式： 功能：插入水平线标记。 6注释标记 格式：注释标记。,2.2 HTML文本设计,2.2.3 建立列表 在网页中经常使用的列表分为：有序列表和无序列表。由带有序号标志（如数字、字母等）的表项组成有序列表。否则就为无序列表。 1. 有序列表 格式： 功能：建立有序列表。,2.2 HTML文本设计,2. 无序列表 格式： 功能：建立无序列表。,2.2 HTML文本设计,3. 自定义列表 格式： 注意：根据文档的具体要求，列表可以嵌套使用。,2.2 HTML文本设计,2.2.4 字符格式化 1字体设置标记 格式： 功能：设置字体格式标记。 size=size：设置文字的大小。数字的范围为17，取1时最小，取7时最大，默认的数值为3。face=fontstyle：设置字体，如宋体、黑体、隶书等。 color=colorvalue：设置文字的颜色。,2.2 HTML文本设计,2其他标记,2.3 加入多媒体与超级链接,2.3.1 加入图像、视频、动画 格式： 功能：在网页中加入图像、视频、动画等。 1插入图像 图像在网页设计中是必不可少的，所以用户应掌握在网页中操作图像的方法。,2.3 加入多媒体与超级链接,2.3 加入多媒体与超级链接,2插入视频 使用插入视频或动画时，含有的属性如下表：,2.3 加入多媒体与超级链接,2.3.2 加入超级链接 格式： 功能：在当前页和其他内容间建立超链接。,2.4 制作表格,2.4.1 建立表格 ,2.4 制作表格,2.4.1 建立表格 创建表格是规划页面最常用的方法。 格式： 功能：创建表格进行页面设计。 在浏览器中显示时，表格的整体外观由标记的属性决定 。,2.4 制作表格,2.4 制作表格,2.4.2 定制表格 只是空表格，还需要定义行和单元格。 格式： 功能：定义表格的一行。 格式： 功能：定义表格中的单元格。 格式： 功能：定义表格标题，显示在表格上方。,2.5 制作表单,2.5.1 表单的结构 格式：定义表单。,2.5 制作表单,2.5.2 FORM中常用的标记 1输入域 （1）单行输入域 1）text类型 2）password类型 3）radio类型 4）checkbox类型 5）submit类型 6）reset类型 7）hidden类型,2.5 制作表单,（2）多行输入域标记,2.5 制作表单,2按钮 格式： 功能：定义按钮。,2.5 制作表单,3选择域 格式： 选项一 选项二 功能：定义选择栏。,2.6 框架结构,2.6.1 框架结构的文件格式 注意：在老版本的浏览器 可能不支持框架结构。 ,2.6 框架结构,2.6.2 框架结构标记的使用 格式：,2.6 框架结构,2.6.3 FRAME标记,2.6 框架结构,TARGET属性三种常见的用法： 1用于A标记 2用于BASE标记 3用于FORM标记,2.7 CSS基础,2.7.1 CSS样式简介 CSS（Cascading Style Sheets，层叠样式表），又称格式页。 2.7.2 CSS样式表的定义 1通过HTML标记定义 2用id属性定义样式表 3使用class定义样式表,2.7 CSS基础,2.7.3 在HTML中加入CSS的方法 1嵌入式样式表 2内联式样式表 3外联式样式表 4输入式样式表,
