资源预览内容
第1页 / 共27页
第2页 / 共27页
第3页 / 共27页
第4页 / 共27页
第5页 / 共27页
第6页 / 共27页
第7页 / 共27页
第8页 / 共27页
第9页 / 共27页
第10页 / 共27页
亲,该文档总共27页,到这儿已超出免费预览范围,如果喜欢就下载吧!
资源描述
第3章 网页设计语言HTML HTML是网页制作的一种规范、一种标准。本章介绍了用HTML制作网页的各种标记符的设置方法,包括网页数据的编辑与格式化、在网页中使用超链接和插入图片、网页中的表格设计以及表格与文字的混排等。2021/8/261教学重点与难点教学重点与难点在网页中使用超链接与图片的编排列表的使用表格与文字的混排2021/8/2623.1 HTML概述 HTML(HyperText Markup Language)超文本标记语言,几乎所有的网页都是以HTML格式书写的。 HTML以标识符来标识、排列各对象。标识符本身以“”标识,标识符内的内容称为元素(element),元素代表了标识符的意义,元素是与大小写无关的。2021/8/263 用超文本标记语言(HTML)编写的网页文件其实只是很平常、很普通的文本文件。可以用你所熟悉的文字编辑器来编辑它,如Edit、Word、写字板、记事本等,但一定要以纯文本方式保存,浏览器只能识别纯文本格式的文件。 标记HTML的开始,在文件结束处要有对应的符号。2021/8/2643.2 网页数据编辑与格式化一、创建HTML文档1用工具软件创建HTML文档 用比较完善的工具软件来制作网页,像FronPage2000,Dreamweaver 4等2用编辑工具编写HTML文档 EDIT、记事本、写字板、Word等编辑工具可以用来编辑HTML文档。2021/8/265二、标签格式 在HTML文件中,重要的文字部分都由“标签”括起来,这样文字就成了特别的文字,而标签本身则以“”号标识,标签内的内容称为元素,它代表了标签的意义。如: 中南省委宣传部主页 括住的文字称为“内容”,整个标签称为一个“元件”。2021/8/266三、标题格式 HTML提供六种标题格式,其所用的标记符为(标题n,n=16), 的字体最大, 的字体最小。其属性如下:(1)ALIGN=LEFT,CENTER,RIGHT:文字左对齐(LEFT)、居中(CENTER)或右对齐(RIGHT)。2021/8/267(2)ID:指定标记符的ID选择器。(3)STYLE:指定标记符的样式表命令。(4)CLASS:指定标记符的样式类型。(5)LANG:指定标题文字的语种。(6)DIR:指定标题文字的方向。(7)TITLE:指定标记符的标题。 此外,还有一些鼠标操作的属性。2021/8/268四、段落格式1分段与换行符 分段标记符用于将文档划分为段落,标记符为 要将文字强制换行,而不是另起段落,可以用换行标记符BR实现该功能。注意,BR仅单独使用,而非成对出现。2. 添加水平线 添加水平线的标记符为(与BR类似,HR也不包括结束标记符。2021/8/2693. 段落对齐(1) ALIGN属性 ALIGN属性用于设置段落的对齐方式,其常见取值有4种:RIGHT(右对齐)、LEFT(左对齐)、CENTER(居中对齐)、JUSTIFY(两端对齐)。(2)DIV标记符(3)CENTER标记符(4)格式的嵌套2021/8/2610五、 文字格式1字符格式 通过表3.1的标记符设置字符格式2字体大小、字符颜色和字体样式(1) SIZE属性:控制文字的大小(2)COLOR属性:控制文字的颜色(3)FACE属性:指定字体样式2021/8/2611六、列表格式1有序列表 定义有序列表需要使用有序列表标记符和列表项(List item)标记符,语法如下: List item1 List item22无序列表 无序列表标记符和列表项标记符2021/8/26123定义列表 定义列表的制作需要3个标记符:定义列表标记符,用来指定定义列表的开头与结尾;定义术语(Definition term)标记符,用来指定第一层数据;定义描述标记符,用来指定第二层数据。标记符必须有结束标记,但和标记符的结束标记可以省略。2021/8/26133.3 在网页中建立超链接一、超链接标记符 创建一个超链接需要使用标记符,A是Anchor的首字母,标记符的最基本属性是HREF,用于指定链接到的文件位置。 其他属性见教材。2021/8/2614二、创建超链接1指向本地网页的链接:绝对URL2 链接至位于相同文件夹的文件: 相对URL方式3链接至位于不同文件夹的文件4指向其他网页的链接,如: 我要上网易5页面的特定部分链接6连接至E-mail地址的超链接2021/8/26153.4 在网页中插入图片一、插入图片 用标记符在HTML文件中插入图片,标记符常用的属性见教材。二、图片布局 可以使用HEIGHT、WIDTH、BORDER属性指定图片的高度、宽度以及是否具有框线。2021/8/26161图片的高度、宽度 ,如: 图片的边框 还可以用标记符的SOLID属性设置边框颜色,格式。3. 图片的对齐方式 图片的对齐是指图片本身在页面中的对齐和图片与文本的对齐。2021/8/26173.5 表格设计一、创建基本表格 可以用标记符创建一个表格,并在它的中间加入标题和需要的数据。表格定义的代码为: 具体表格内容 2021/8/26181. 表格的标题元素定义了表格的说明。如: 在这里输入标题 行里的内容 标题的属性ALIGN决定了标题的对齐方式。TOP是将标题放在表格的顶部,BOTTOM将标题放在表格的下面。2021/8/26192. 行、表头和数据 定义一个表格,需从第一行逐级向下,并且按行中单元格的顺序开始定义。行、表头和数据定义的代码为: 表头 数据 2021/8/2620二、 表格及文字的对齐与布局1表格在页面中的对齐 利用表格的ALIGN属性,可以将表格显示在页面的左边或右边。如果没有设置这一属性,表格单独显示为页面的一行,在页面的左侧。ALIGN=”LEFT”将表格按左边对齐,而表格的所有文本显示在表格右侧和页面之间的位置。ALIGN=”RIGHT”将表格按右边对齐,文本显示在表格的左侧。2021/8/26212. 表格内数据的对齐 ALIGN属性为单元格数据提供水平对齐方式,该属性有LEFT(左对齐)、RIGHT(右对齐)、CENTER(居中)3个值。VALIGN属性定义单元格数据的垂直对齐方式,该属性有TOP(顶部对齐)、BOTTOM(底部对齐)、MIDDLE(中间对齐)3个值。2021/8/2622三、设置表格尺寸 设置表格边框尺寸 利用的BORDER属性可以设置表格边框的尺寸,它以指定的粗度来显示表格边框。如: 2. 设置表格尺寸 利用的WIDTH和HEIGHT属性可以设置表格尺寸。如: 2021/8/26233. 设置表元间隙 利用标记符的CELLSPACING属性可以设置表元的间隙。如: 4. 设置表元内部空白 利用标记符中的CELLPDDING属性来,以像素为单位来设置它的值。如: 2021/8/2624四、设置表格的色彩 设置表格、行或行中单元的相关颜色,可以在、和标记符里使用BGCOLOR、BORDERCOLOR、BORDERCOLORLIGHT、BORDERCOLORDARK等属性。 COLOR的值可以是以十六进制表示的颜色,或者是16种颜色(BLACK、WHITE、GREEN、MAROON、OLIVE、MAVY、PURPLE、GRAY、RED、YELLOW、BLUE、TEAL、LIME、AQUA、FUCHSIA和SILVER)中的一种。2021/8/2625五、创建跨多行、多列的表元 跨越多列 在或标记符里利用COLSPAN属性,并在其后写上想要跨越的列数。 跨越多行 在或标记符里利用ROWSPAN属性,并在其后写上想要跨越的列数。2021/8/2626部分资料从网络收集整理而来,供大家参考,感谢您的关注!
收藏 下载该资源
网站客服QQ:2055934822
金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号