《与页面设计》PPT课件.ppt
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_1.gif)
![资源得分’ title=](/images/score_05.gif)
《《与页面设计》PPT课件.ppt》由会员分享,可在线阅读,更多相关《《与页面设计》PPT课件.ppt(40页珍藏版)》请在得力文库 - 分享文档赚钱的网站上搜索。
1、第3章 HTML与页面设计参考网站:含有示例演示环境,HTML 在线编辑器,用来在线测试各种示例的运行结果 本章要点及学时安排学会使用HTML的常用标记学会在HTML页面中建立和调整表格熟练使用HTML的超链接和图片熟悉HTML页面的框架理解HTML和ASP.NET的关系理解“初步设计学生管理信息系统用户界面”的含义-学时安排-本章要点本章授课学时为1-2学时练习和上机学时为1-2学时教学内容HTML简介HTML网页的段落与文字在HTML网页中使用超链接在HTML网页中使用图片在HTML网页中使用表格在HTML网页中设定框架在HTML网页中建立表单HTML和ASP.NET设计学生管理信息系统用
2、户主页面3.1 HTML简介HTML是一种描述性语言,由文本和文本和标记组合而成,后缀名是.htm或.html【例3-1】第一个HTML文件a)双击html文件显示结果 b)在浏览器中输入地址显示结果3.2 HTML网页的段落与文字网页中常用的几种与段落和文字有关的基基本本标记及其属性及其属性注释标题换行和段落和水平分割线和【例3-2】使用画一条水平分隔线,运行结果如图:3.3 在HTML网页中使用超链接超链接:代表一个链接点,将当前位置的文本或图片连接到其他的页面、文本或图像。主要语法:在在和和之之间,是超,是超链接要接要显示的文字或示的文字或图片片如:用本窗口打开网易用本窗口打开同一文件夹
3、下的test.html页面3.3 在HTML网页中使用超链接网页内部进行跳转,其基本格式是:第二部分第二部分第一部分内容第二部分实际内容这样当点击“第二部分”这个超链接后,就会自动转到“第二部分实际内容”这个地方来。3.4 在HTML网页中使用图片将图片插入HTML网页指定图片区域设定超链接3.4.1 将图片插入HTML网页使用标记可以在网页中插入图片主要语法:alt:当鼠标放在图片上时,显示的小段提示文字,一般用于说明此图片的标题或主要内容。当图像文件无法在网页中显示时,在图像的位置也会显示alt所设置的文字。width和height:在默认情况下,如果改变其中一个值,则另一个值也会等比例进
4、行调整,除非同时设置两个属性。3.4.2 指定图片区域设定超链接1.图片超链接主要格式:2.图片的热区链接除了对整幅图像设置超链接外,还可以将图像划分为若干区域,叫做“热区”,每个区域可设置不同的超链接。包含热区的图像可以称为“映射图像”,需要使用标记的usemap属性,定义图像的映射图像名,语法格式为:在图像中定义各个热区以及超链接,主要语法为:其中标记有两个重要属性:shape属性,用来定义热区形状。coords属性,用来定义矩形、圆形或多边形区域的坐标。【例3-4】图片热区链接,显示效果如下:如果鼠标移动到图片“?”附近的矩形区域,光标会变成小手的形状,单击则打开help.html页面。
5、3.5 在HTML网页中使用表格建立一个HTML网页表格设定表格行在表格中加入单元格及其内容3.5 在HTML网页中使用表格在网页中使用和标记来创建表格:在表格中横的称为行(row),用和表示,每一行又可以分为很多列(column)或单元格(cell),用和表示。语法如下:单元格内的文字单元格内的文字单元格内的文字单元格内的文字单元格内的文字单元格内的文字单元格内的文字单元格内的文字3.5.1 建立一个HTML网页表格标记常用语法格式为:3.5.1 建立一个HTML网页表格其中各属性的意义如下:align:表格在上一层容器控件中的对齐方式。有center、left、right三个值,其中lef
6、t是默认对齐方式。bgcolor:设置表格的背景色,默认是上级容器的背景色。border:表格线的宽度,单位是像素,默认值是1。bordercolor:设置表格线的颜色。如果没有包含border属性,或者border属性值是0,则忽略此属性值。height:表格的高度,以像素或页面高度的百分比为单位。但如果表格内容大于设置的高度,则表格会自动扩张,以便容纳所要显示的内容。width:表格的宽度,以像素或页面宽度的百分比为单位。但如果表格内容大于设置的宽度,则表格会自动扩张,以便容纳所要显示的内容。cellpadding:单元格内部所显示的内容和表格线的距离,单位是像素。cellspacing:
7、表格线的间隔,单位是像素或百分比。3.5.2 设定表格行要设置表格各行的属性,需要使用标记的各个属性。标记及其属性的常用语法格式为:标记的一些和不同的属性的意义如下:align:文本在单元格中的水平对齐方式。有center、left、justify、right四个值,其中left是默认对齐方式,justify是指在单元格中合理调整内容,以恰当显示。valign:文本在单元格中的垂直对齐方式。有baseline、top、middle、bottom四个值,默认值是middle,即垂直居中对齐。baseline是指单元格中内容以基线(baseline)为准,垂直对齐,它类似于bottom(底端对齐)
8、。3.5.2 设定表格行3.5.3 在表格中加入单元格及其内容标记的常用语法格式为:标记的一些和或不同的属性的意义如下:colspan:该单元格在水平方向上跨的列数,默认为1。rowspan:该单元格在垂直方向上跨的行数,默认为1。colspan和rowspan是为制作复杂表格准备的。3.5.3 在表格中加入单元格及其内容【例3-5】设置表格行、列。显示结果如图所示:3.6 在HTML网页中设定框架框架(frame)最主要的功能是用来分割页面窗口,使每个“小窗口”能显示不同的HTML文件。框架的基本结构浮动框架3.6.1 框架的基本结构使用框架结构,可以在一个浏览器窗口中装载多个HTML文件,
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 与页面设计 页面 设计 PPT 课件
![提示](https://www.deliwenku.com/images/bang_tan.gif)
限制150内