《Java程序设计教程 教学课件 ppt 作者 978-7-302-18214-6 第10章-HTML基础》由会员分享，可在线阅读，更多相关《Java程序设计教程 教学课件 ppt 作者 978-7-302-18214-6 第10章-HTML基础（37页珍藏版）》请在金锄头文库上搜索。
1、第10章 HTML基础,本章学习目标,熟悉Java Applet的宿主环境，即HTML网页。 掌握HTML网页的基本结构和常用标签。 学会制作简单的个人主页。,Applet,/ HelloWorld.java import java.awt.*; import java.applet.*; public class HelloWorld extends Applet public void paint(Graphics g) g.setColor(Color.blue); g.drawRect(10,10,100,150); g.drawString(“Hello World“,25,50);
2、 ,Applet与HTML, Example ,演示,在线计算器,HTML,HTML入门 HTML基本构架 页面布局与文字设计 列表,多媒体效果 TABLE表格,HTML入门,HTML英语意思是：Hypertext Marked Language，即超文本标记语言 通过HTML可以表现出丰富多彩的设计风格 通过HTML可以展现多媒体的效果 标签 “”,HTML的基本结构,文档头、文档体 头 部 信 息 文 档 主 体， 正 文 部 分 ,HTML的基本结构,下面是一个最基本的超文本文档的源代码： 一个简单的HTML示例 欢迎光临我的主页 这是我第一次做主页，无论怎么样，我都会努力做好！ ,超文
3、本中的标签,单标签 双标签 内 容 标签属性 ,页面布局及文字设计,标题 换行 段落标签 水平线段 文字的大小设置 文字的字体与样式 文字的颜色 位置控制 综合示例,标题,HTML中提供了相应的标题标签, 总共提供六个等级，n越小，标题字号就越大 第一级标题 第二级标题 第三级标题 第四级标题 第五级标题 第六级标题 请看例子,换行,在HTML语言规范里，每当浏览器窗口被缩小时，浏览器会自动将右边的文字转折至下一行。所以，编写者对于自己需要断行的地方，应加上标签。,段落标签,文件段落的开始由来标记，段落的结束由来标记，是可以省略的，因为下一个的开始就意味着上一个的结束 标签还有一个属性ALIG
4、N，它用来指名字符显示时的对齐方式，一般值有CENTER、LEFT、RIGHT三种 请看例子,水平线段,这个标签可以在屏幕上显示一条水平线，用以分割页面中的不同部分。 有四个属性： size 水平线的宽度 width 水平线的长，用占屏幕宽度的百分比或象素值 来表示 align 水平线的对齐方式，有LEFT RIGHT CENTER三种 noshade 线段无阴影属性，为实心线段,水平线段,线段粗细的设定 线段长度的设定 线段排列的设定 无阴影的设定 请看例子,文字的大小设置,提供设置字号大小的是FONT，FONT有一个属性SIZE，通过指定SIZE属性就能设置字号大小，而SIZE属性的有效值
5、范围为17，其中缺省值为3。我们可以SIZE属性值之前加上“”、“”字符，来指定相对于字号初始值的增量或减量。 请看示例,文字的字体与样式,HTML提供了定义字体的功能，用FACE属性来完成这个工作。 FACE的属性值可以是本机上的任一字体类型，只有对方的电脑中装有相同的字体才可以在他的浏览器中出现你预先设计的风格。 请看例子,文字的字体与样式,为了让文字富有变化，或者为了着意强调某一部分，HTML提供了一些标签产生这些效果，现将常用的标签列举如下： 粗体 HTML语言 斜体 HTML语言 加下划线 HTML语言 打字机字体 HTML语言 大型字体 HTML语言 小型字体 HTML语言 表示强
6、调，一般为斜体 HTML语言 表示特别强调，一般为粗体 HTML语言 用于引证、举例，一般为斜体 HTML语言,文字的颜色,文字颜色设置格式如下： 这里的颜色值可以是一个十六进制数(用“#”作为前缀)，也可以是颜色名称 如：Black = “#000000“ Green = “#00FF00“ Red = “#FF0000“ Blue = “#0000FF“ 请看例子,列表,无序号列表 序号列表,无序号列表,无序号列表使用的一对标签是，每一个列表项前使用。其结构如下所示： 第一项 第二项 第三项 请看例子,序号列表,序号列表和无序号列表的使用方法基本相同，它使用标签，每一个列表项前使用。每个项
7、目都有前后顺序之分，多数用数字表示。其结构如下所示： 第一项 第二项 第三项 ,多媒体效果,插入图象 播放音乐 播放视频,插入图形,超文本支持的图象格式有GIF、JPEG等。 插入图象的标签是，其格式为： 请看例子,播放音乐,点播音乐 将音乐做成一个链接：乐曲名 自动载入音乐 基本语法： ,播放视频,链接一个视频文件 将视频文件做成一个链接的方法： 视频名称 自动载入视频 与音乐的播放一样，我们可以使用EMBED标签播放视频： ,TABLE表格,表格的基本结构 表格的标题 表格的尺寸设置 表格内文字的对齐、布局 跨多行、多列的表元 表格的颜色,表格的基本结构,. 定义表格 . 定义标题 定义表
8、行 定义表头 定义表元(表格的具体数据) 一个简单的例子,表格的标题,表格标题的位置，可由ALIGN属性来设置，其位置分别由表格上方和表格下方。下面为表格标题位置的设置格式。 设置标题位于表格上方： . 设置标题位于表格下方： . ,表格尺寸设置,表格的大小 一般情况下，表格的总长度和总宽度是根据各行和各列的总和自动调整的，如果我们要直接固定表格的大小，可以使用下列方式： width和height属性分别指定表格一个固定的宽度和长度，n1和n2可以用像素来表示，也可以用百分比（与整个屏幕相比的大小比例）来表示,表格尺寸设置,边框尺寸设置 边框是用border属性来体现的，它表示表格的边框边厚度
9、和框线。将border设成不同的值，有不同的效果。 如： 定货单 苹果香蕉葡萄 200公斤200公斤100公斤 ,表格尺寸设置,格间线宽度 格与格之间的线为格间线，它的宽度可以使用中的CELLSPACING属性加以调节。格式是： #表示要取用的像素值 例： 定货单 苹果香蕉葡萄 200公斤200公斤100公斤 ,表格尺寸设置,内容与格线之间的宽度 我们还可以在中设置CELLPADDING属性，用来规定内容与格线之间的宽度。格式为： #表示要取用的像素值 例： 定货单 苹果香蕉葡萄 200公斤200公斤100公斤 ,表格内文字的对齐/布局,表格中数据的排列方式有两种，分别是左右排列和上下排列。左
10、右排列是以ALIGN属性来设置，而上下排列则由VALIGN属性来设置。 其中左右排列的位置可分为三种：居左（left)、居右(right)和居中(center)； 而上下排列基本上比较常用的有四种：上齐(top)、居中(middle)、下齐(bottom)和基线(baseline)。 #=left, center, right #=top，middle，bottom，baseline ,表格的颜色,在表格中，既可以对整个表格填入底色，也可以对任何一行、一个表元使用背景色。 表格的背景色彩 行的背景色彩 表元的背景色彩 或 #=rrggbb 16进制 RGB数码, 或者是下列预定义色彩名称： B
11、lack, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, White, Green, Purple, Silver, Yellow, Aqua,学习HTML的方法提示：,对于难记的属性不必强行记忆，在用到的时候翻一下语法手册，多用几次就会熟练掌握了。 刚开始，可以先选择几个不错的网页加以模仿，照葫芦画瓢的完成自己的Homepages. 看到好的网页，可以在浏览器的“编辑”菜单中选择“源文件”，这时我们就可以看到源程序， 学习别人制作网页的一些方法和技巧了，有时候通过这种办法可以学到书本上没有的东西，一些新出现的功能也可以率先出现在你的网页中了。,作业,1 4 6*,
