网页制作基本语言HTML_第1页
网页制作基本语言HTML_第2页
网页制作基本语言HTML_第3页
网页制作基本语言HTML_第4页
网页制作基本语言HTML_第5页
已阅读5页，还剩21页未读， 继续免费阅读

下载本文档

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

文档简介

第四章网页制作根本语言HTML目录4.1HTML简介4.2HTML文档的根本结构4.3HTML标签4.4创立超链接4.5插入网页元素4.6表单4.7框架4.1HTML简介HTML是一种页面描述语言，用HTML编写的文档称为HTML文档。通过Web浏览器阅读HTML文档时，浏览器负责解释HTML文档并将其以页面的形式呈现在用户面前，这样的页面就是Web页面。HTML也称作超文本标签语言，用HTML给文本文件添加标签，使其可以在WWW上发布何在浏览器中显示。HTML作为网页制作的排版语言，是网页设计的根底，其主要功能如下：格式化文本。如设置标题、字体、字号、颜色、段落、对齐方式等。建立超链接。单机超链接可以实现页面间的跳转。安排页面布局。借助表格、框架更设置整个页面的布局。引入多媒体。在页面中添加图像、音频、视频、动画等，丰富页面效果。设置交互式表单。通过文本域、选框、下拉菜单等与用户进行交互。4.1HTML简介从本质上来说，HTML文件是一种纯文本文件，因而可在任何文本编辑器中制作，如记事本、写字板、Word等。用HTML编写的超文本文档称为HTML文档，它独立于各种操作系统平台，可以通过浏览器读取，并由浏览器内容的语法分析器自动解释其中包含的各种标签并按一定的格式显示，最终呈现精彩的Web页面效果。4.2HTML文档的根本结构HTML文档由标签和文本组成，两者相互配合产生所需的Web页面效果。<html><head><title>网页标题</title></head><body>网页正文</body></html>在记事本中输入以上代码，以.htm或.html格式保存文件后即可完成一个简单的网页制作。4.3HTML标签标签是HTML的根本元素。在HTML文档中的社党位置添加标签，可以实现各种页面效果。标签的根本语法格式如下：<标签>受标签影响的文本</标签>标签内还可以包含一系列属性，通过设置属性可以实现各种效果。设置标签属性的语法结构如下：<标签[属性1=属性值][属性2=属性值]…[属性N=属性值]>…</标签>HTML标签封装在由“<〞和“>〞构成的一对尖括号中，属性可缺省。浏览器在解释HTML文档时，根据“<〞和“>〞识别标签，然后确定其中的内容。多数标签包含开始标签“<标签>〞和结束标签“</标签>〞两局部，称为成对标签。不需要“</标签>〞结束的标签为单标签。4.3.1页面标签在4.2节介绍的HTML文档根本结构中，除了文本以外，还涉及以下4个HTML标签。1.HTML文档标签HTML文档标签<html>…</html>出现在最外层，表示这对标签间的内容是HTML文档。每个HTML文档均以<html>开始，以</html>结束。2.HTML文档头标签HTML文档头标签<head>…</head>用于说明标题名、文本文件地址、创作信息等头部信息，假设不需要头部信息那么可以忽略此标签。3.HTML文档标题标签HTML文档标题标签<title>…</title>用于定义标题内容并将其显示于浏览器标题栏，其作用是概括网页内容，便于浏览者将网页参加书签或保存至磁盘。4.3.1页面标签4.HTML文档主体标签HTML文档主体标签<body>…</body>用于定义网页上显示的主要内容与格式，是整个网页的核心，浏览器窗口中显示的网页内容都包含在该标签中。<body>有很多属性，用于设置页面的背景颜色、背景图像、文字颜色、超文本链接的颜色，可以控制网页的总风格。4.3.2文字与段落标签HTML中的标签有许多用于控制页面文字及段落格式，每种标签都从某一方面对页面文本产生影响，甚至可以利用不同的标签实现相同的控制效果。1.标题的设置页面文字中，标题是一段文字的核心，可用加强的效果来表示，通过设置不同大小的标题为文字段落增加条理性。设置标题的语法格式如下：<hnalign=对齐方式>标题</hn>标题文字以宋体显示并且自动换行。n用来定义标题的大小，取值范围为1~6，取1时最大，取6时最小。属性align用来设置标题在页面中的对其方式，取值可为left〔左对齐〕、center〔居中〕或right〔右对齐〕。4.3.2文字与段落标签2.强制换行在HTML文档中无法通过enter键进行换行，因此需要进行强制换行。强制换行标签<br>出现时，表示从该处开始新的一行。强制换行的语法格式如下：文字<br>3.文字格式的控制通过<font>标签设置网页文字的字体、大小和颜色，可以增强文字显示的多样性和层次感。使用<font>标签控制文本格式的语法格式如下：<fontface=字体名size=数字color=颜色>受影响的文字</font>4.3.2文字与段落标签常用颜色的英文单词及十六进制代码4.3.2文字与段落标签常用的字形控制标签4.3.2文字与段落标签4.段落格式的控制1〕强制换段网页中的正文常常需要分成多段文字。与强制换行相似，在HTML文档中无法用Enter、Space、Tab等控制键来调整段落，因而需要借助<p>标签强制分段。使用该标签后，每块正文段落间会空出一行。使用<p>标签换段的语法格式如下：<palign=对齐方式>受影响的文字</p>2〕预编排格式在其他编辑工具中编排好的文本中可能包含一些HTML文档不支持的控制符号，如回车符、换行符等，如果希望网页最终的显示效果与编辑时的格式一致，可借助预编排格式标签<pre>。语法格式如下：<pre>预先编排好的格式</pre>4.4创立超链接超链接是指Web页面从一个页面跳转到另一个页面或从一个位置跳转到另一个位置的链接关系。连接的目标通常是一个web页面，也可以是图片、多媒体、电子邮件甚至程序。1.锚点标签利用锚点标签<a>可以对网页中的文本或图片等建立超链接，单击链接后即可跳转到指定的目标资源，该资源具有唯一的URL地址。上述的文本或图片称为热点。锚点标签的语法格式如下：<ahref=目标文件地址name=字符串>热点文本</a>href属性为超文本引用，其值为一个确定的URL地址，用于指明目标资源的位置；name属性用来指定当前文档内的一个字符串。4.4创立超链接2.相对路径和绝对路径在设置href属性的URL地址时，如果当前页面与目标页面不在统一效劳器上，那么设置为绝对路径；如果当前页面与目标页面在同一效劳器上，只需设置相对路径。根据当前网页与目标网页的不同位置关系，相对路径有4种情况〔1〕当前网页与目标网页在同一目录中：<ahref=目标文件名.htm>热点文本</a>〔2〕当前页面与目标页面在同级目录中：<ahref=../子目录名/目标文件.htm>热点文本</a>〔3〕目标页面位于上一级目录中：<ahref=../目标文件.htm>热点文本</a>〔4〕目标页面位于下一级目录中：<ahref=子目录名/目标文件.htm>热点文本</a>4.4创立超链接3.指向当前页面内部的链接页面内部的超链接可以使得单击热点文本后从页面中的一个位置跳转到指定的另一个位置，为此需要分别设置锚点标签的href属性和name属性。创立指向当前页面内部链接的语法格式如下：<ahref=#标签名>热点文本</a>单击热点文本会跳转到设置了标签的位置。设置标签的语法如下：<aname=#标签名>目标文本附近的字符串</a>4.指向电子邮件的链接设置链接目标为电子邮件时，单击热点文本，将翻开默认的电子邮件程序，并自动填写地址。创立电子邮件的语法格式如下：<ahref=〞mailto:e-mail地址〞>热点文本</a>4.5.1插入图像使用图像标签<img>可以将一幅图像插入网页中，相应的属性设置可以控制图像的大小、布局、注释等。插入图像的语法格式如下：<imgsrc=图像文件地址alt=图像说明width=图像宽度height=图像高度border=边框宽度><img>标签各个属性的作用：4.5.1插入图像此外，还可以对图像进行如下设置：〔1〕设置图像超链接：<ahref=地址><imgsrc=图像文件名></a>〔2〕将图像设置为页面背景：<bodybackground=图像文件名>...</body>〔3〕设置图像和文字的混排版面，如图文间的空白、图文对齐与环绕等：<imgsrc=图像地址hspace=水平方向空白vspace=垂直方向空白align=对齐方式>4.5.2插入音乐、视频使用<bgsound>标签可以在网页中插入背景音乐，其语法格式如下：<bgsoundsrc=音频文件地址loop=播放次数>使用<img>标签的dynsrc属性可以在网页中参加.avi格式的视频剪辑文件，其语法格式如下：<imgsrc=图像文件地址dynsrc=视频文件地址loop=播放次数loopdelay=时间start=时间>4.6.1制作表单表单标签<form>用于处理和传达表单结果，其语法格式如下：<formaction=〞URL〞method=〞method〞>......<inputtype=表单类型>......</form>其中，action属性用于指定处理表单数据的Web应用程序的URL；method属性指定数据的提交方式，取值为get时表示获得表单，取值为post时表示送出表单；<input>标签用于创立表单中提供给用户的输入域。4.6.2表单元素1.<input>标签用<input>标签在表单中创立文本框、密码框、复选框、单项选择按钮、提交或重置按钮等。4.6.2表单元素2.<select>标签用<select>标签在表单中创立下拉列表框，创立下拉列表框的语法格式如下：<selectname=列表框的名称><option>...<option>...<option>...</select>其中，<option>标签表示待选工程。4.6.2表单元素3.<textarea>标签<textarea>标签用于创立文本域。文本域用于发表文章、评论、留言等需要输入较多文字的场合。创立文本域的语法格式如下：<textareaname=文本域的名称rows=文本域行数cols=文本域列数>...</textarea>4.7.1建立框架框架页面也称为多窗口页面，建立框架的语法格式如下：<frameset><framsrc=页面地址></frameset>在制作框架页面时，<frameset>标签取代了<body>标签，用来声明框架组及其外观。<frameset>标签的属性如下表：4.7.1建立框架<frame>标签用于指定框架页面的内容，其属性如下表：<frame>标签的个数应该等于<frameset>标签中所

人人文库> 全部分类> 行业资料 > 管理策划

温馨提示

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

最新文档

评论

0/150

提交评论