第1章 HTML页面及表格_第1页
第1章 HTML页面及表格_第2页
第1章 HTML页面及表格_第3页
第1章 HTML页面及表格_第4页
第1章 HTML页面及表格_第5页
已阅读5页，还剩32页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

HTML网页设计本课程目标页面与表格的设计文字布局和文字效果图像、CSS样式定义与应用、浮动窗口框架、页面版式控制与多媒体效果表单与页面控件第一章HTML页面与表格本章目标掌握HTML文件的结构理解HTML文件的背景色及文本色掌握页面上添加超链接掌握在页面设置表格本章任务用表格完成个人简历网页基础知识互联网是世界上最大的计算机网络互联网被称为网络的网络万维网是互联网中的一个子网WWW包含分散在世界范围内的众多Web服务器（WorldWideWeb）超文本传送协议——HTTP(HyperTextTransferProtocol)HTTP协议用经常用在传送WEB页网站是由若干个文件组成网页基础知识统一资源定位器——URL（UniformResourceLocator）URL包括传送协议，服务器名称、文件的完整路径例如：/index.html其中http://是传送协议是服务器名称

index.html是文件的完整路径服务器名称还有其他的叫法，主机名、域名。一般大众叫法叫域名.等等代表服务类型。网页基础知识-HTML（超级文本标记语言）HTML是HypertextMarkupLanguage（超文本标记语言）的缩写，它是构成Web页面（Page）的主要工具，是用来表示网上信息的符号标记语言。HTML文档由文本和HTML标记组成，通常以.html或者.htm为文本的扩展名（如index.htm）。网页浏览器负责解释HTML文档中的标记，并将HTML文档显示为网页.不同的浏览器中网页的显示效果可能不同。大多数浏览器不完全支持HTML的所有特性，每一种浏览器都可能会有一些特有的HTML标记和属性，这些标记和属性可能不会被其他的浏览器识别。这些有软件公司开发的标记和属性被称为HTML扩展，而不是标记的一部分。HTML和网页浏览器的关系HTML和网页浏览器的关系：不同的浏览器中网页的显示效果可能不同。大多数浏览器不完全支持HTML的所有特性，每一种浏览器都可能会有一些特有的HTML标记和属性，这些标记和属性可能不会被其他的浏览器识别。这些有软件公司开发的标记和属性被称为HTML扩展，而不是标记的一部分。小结www表示什么？URL表示什么？HTML表示什么意思？HTML文档通常以什么格式保存？超文本标记语言——HTMLHTML标记基本格式标记内可以包含一些属性

<标记>文件内容</标记>

<标记名称属性1属性2属性3……>HTML中的注释：<!--内容-->HTML页面的基本结构

起始标记网页标题文件主体

<Html><Head> 网页的标题和属性</Head><Body> 文件主体</Body></Html> 基本结构起始标记

<Html>标记符号<Html>标记用于HTML文档的最前面，用来标记HTML文档的开始</Html>则是放在HTML文档的最后面，用来表示HTML文档的结束两个标记必须一起使用</Html>文件头

<Head></Head>结构文件头标记对构成HTML文档的开头部分用来描述HTML文档相关信息文件头<Head></Head>标记对构成HTML文档的开头部分

1．Title标记<Title></Title>文件标题

2．Base标记<Basehref=”URL”>

//base标记是一个基链接标记，是一个单标记。3．Link标记<Linkrev=”RELATIONSHIP”rel=”RELATIONSHIP”href=”URL”>定义文档关联的文件，用于链接CSS样式表文件或Javascript程序文件等。4．Meta标记< Metahttp-equiv=”Content-Type”content=”text/html;charset=gb2312”>页面主体格式和页面效果 <Body></Body>标记对之间的内容是HTML文档的主要部分，在此标记对之间可包含众多的标记和信息

<Body>标记中还可以设置一些属性

两个标记必须一起使用 index.html

小结HTML由哪几部分组成？HTML中设置标题用那个标签？HTML中body标签有什么作用？页面链接页面链接的基本概念外部链接内部链接邮件链接了解路径绝对路径

相对路径

绝对路径是指完整的描述文件位置的路径所谓相对路径，顾名思义就是自己相对与目标位置C:\internet\index.htmlservice/index.html

外部链接 链接到外面去，可以扩充您网站的实用性及充实性，也正因这功能，才造就了www五彩缤纷的世界。

一个超链接通常由以下3个部分构成：

超链接标记<a></a>属性href及其值超链接中显示页面上显示链接的文字<aHref=””>新浪网</a>内部链接

有时候，当某页的内容很多时，我们可以利用网页的内部链接，以便使用者快速的找到资料. 原理：在欲链接处做个记号

链接时就寻找个这记号内部链接就是网页中的书签格式

<aName=”书签名称”>书签内容</a><aname=”标签a”>书签内容</a><aHref=”#标签a”>单击此处监视浏览器调到“标签a”处</a>邮件链接邮件链接可使访问者在浏览页面时，只需单击电子邮件链接就能打开默认的邮件编辑软件，向指定的地址发送邮件

格式<aHref=”mailto:it@”>清华IT在线</a> 访问者单击电子邮件链接时，将打开默认的电子邮件编辑软件

小结页面链接的分类？各在什么情况下使用？表格一般的表格由那些部分组成？表格的基本形式表格的作用一个表格由<table>标记开始，</table>结束表的内容由<tr>,<th>和<td>定义

单元行单元格<th>标记所标记的单元格的文字以粗体出现，通常用于表格的标题栏一般用于对网页的内容进行排版

表格的例子

<Body><TableBorder=1align="center"><Tr><Th>编号</Th><Th>名称</Th><Th>价格(元)</Th></Tr><Tr><Td>001</Td><Td>语文教材</Td><Td>20.00</Td></Tr></table></Body>simpleTable.html有通栏的表格1．有横向通栏的表格用<tdcolspan=#>属性说明2．有纵向通栏的表格用<tdrowspan=#>属性说明#代表通栏占据的网格数以像素为单位横向通栏示例

<TableBorder=1align="center"><Tr><Tdcolspan="3"align="center">图书信息</Td></Tr><Tr><Th>编号</Th><Th>名称</Th><Th>价格(元)</Th></Tr></table>表的大小，边框宽度，表格间距

1．表的大小用width=#和height=#属性说明2．边框宽度由border=#说明3．表格间距即划分表格的线的粗细用cellspacing=#表示宽

高

#是以像素为单位的整数表格的粗细

<TableBorder=5

width="150"height="100"cellspacing="5"align="center"><Tr><Th>编号</Th><Th>名称</Th><Th>价格(元)</Th></Tr><Tr><Td>001</Td><Td>语文教材</Td><Td>20.00</Td></Tr></table>表格中文本的输出1．文本与表框的距离用cellpadding=#设置2．表格的宽度大于其中的文本宽度时，文本在其中的输出位置用“align=#”定义3．表格的高度大于其中文本的高度时，可以用valign=#说明文本在其中的位置。#是left，center和right三者之一，分别表示左对齐，居中和右对齐#是top，middle，bottom，baseline四者之一。分别表示顶端对齐、居中对齐、底部对齐、基线对齐#是以像素为单位的整数<Tdalign="left">001</Td>文本与表框的距离

<Html><Head><Title> 表格中文本的输出</Title></Head><Body><TableBorder=1Cellpadding="10"align="center"> <Tr> <Th>编号</Th><Th>名称</Th><Th>价格(元)</Th> </Tr> <Tr> <Td>001</Td><Td>语文教材</Td><Td>20.00</Td> </Tr> </table></Body></Html>表格的高度大于其中文本的高度

<Body><TableBorder=1height="200"align="center"> <Tr> <Th>编号</Th> <Th>名称</Th> <Th>价格(元)</Th> </Tr> <Tr> <Tdvalign="top">001</Td> <Tdvalign="middle">语文教材</Td> <Tdvalign="bottom">20.00</Td> </Tr></table></Body>表格在文件中的位置定义 表格与文件中内容对齐时，若在现在位置上不能满足其对齐方式，可定义其位置，以满足对齐要求 属性一般由align=left、right或center指定<TableBorder=1align="center"><Tr><Th>编号</Th><Th>名称</Th><Th>价格(元)</Th></Tr><Tr><Td>001</Td><Td>语文教材</Td><Td>20.00</Td></Tr></table>表格颜色表格的颜色用bgcolor=#指定#是16进制的6位数，格式为rrggbb红

绿蓝<TableBorder=1align="center"><Trbgcolor="lime">

人人文库> 全部分类> 教育资料 > 辅导培训

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论