JavaWeb程序设计 课件 ch02 HTML 基础_第1页
JavaWeb程序设计 课件 ch02 HTML 基础_第2页
JavaWeb程序设计 课件 ch02 HTML 基础_第3页
JavaWeb程序设计 课件 ch02 HTML 基础_第4页
JavaWeb程序设计 课件 ch02 HTML 基础_第5页
已阅读5页，还剩22页未读， 继续免费阅读

下载本文档

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

文档简介

第2章HTML基础本课教学内容静态网页制作HTML中的常见标签表格标签链接和图片标签表单标签框架静态网页制作HTML简介HTML（HyperTextMark-upLanguage，超文本标记语言），是构成网页文档的主要语言。一般情况下，网页上看到的文字、图形、动画、声音、表格、链接等元素大部分都是由HTML语言描述的静态网页制作HTML简介

HTML语言的基本组成部分是各种标签，一张生动的网页往往含有大量的标签。使用标签，实际上就是采用一系列指令符号来控制输出的效果，如：<BR>，是最常使用的控制格式的标签，它表示在网页上换行静态网页制作HTML简介HTML有两种类型的标签，一类是单标签，<BR>就是一种单标签，它只需要单独一组符号就可以表示完整的功能。另一种是双标签，形如<B>内容</B>，表示将"内容"显示为粗体，这种标签所围绕的内容就是标签作用的作用域静态网页制作HTML简介标签还有属性，如：<ahref=page.html/>，其中的“href”就是一个属性名称，“page.html”是属性值。以HTML编写成的文本文件的后缀名为.html，另外，版本较老的.htm后缀名也是被支持的，它们的意义相同。静态网页制作HTML简介HTML语言对于大小写不敏感，比如马上将要学习的表示HTML文档的标签：<html></html>，也可写做<HTML></HTML>，甚至可以写为<HtmL></htMl>，但是一般推荐，自始至终使用同一种书写方式HTML文档的基本结构HTML文档的基本结构如下：<html> <head>头部信息 </head> <body> 主体 </body></html>文字布局及字体标签标题、换行、段落标签标题标签

在HTML中，标题的一般形式为：<hn>内容</hn>。n可取1~6，n越小，标题字号就越大。换行标签

<br>是换行标签，在需要换行的地方加上此标签即可。段落标签

<p>为段落标签，一个段落开始由<p>来标记，结束用</p>表示。<p>有一个常用属性align，用来指明内容显示时的对齐方式，常用的有left、center和right，分别表示左对齐、居中对齐和右对齐。文字布局及字体标签水平线段标签<hr>是水平线段标签，此标签较为常用的属性有：size：水平线的宽度，单位为像素width：水平线的长，如不设置则默认为页面长度，单位默认为像素，但也可以使用百分制，如width=50%表示长度为页面长度的50%align：水平线的对齐方式，常用的有left，center，right。noshade：线段无阴影属性，没有属性值，若设置，则线段为实心线段color：线段内部的颜色文字布局及字体标签文字设计标签

<font></font>

<font></font>标签一般用于标记字体，此标签有以下几种常见的属性：size：用来设置字体大小，它的属性值有两种写法：一种为size=X，其中X为从1到7，值越大，字体越大，属性值为3是客户端网页的默认字体大小；另一种方法是size=+X或-X，X同样为从1到7的值，意思是以基准字体大小为标准大X号字体或者小X号字体face：用来设置字体类型，默认为宋体。如<fontface="楷体_GB2312">，即设置该内容的输出的字体为楷体但是需要注意的是，只有电脑中安装的字体才可以在浏览器中出现相应风格，如果用户没有安装该字体，则会显示默认字体的风格color：用于设置字体颜色HTML中的常见标签常见的设置文字风格的标签有：<b>内容</b>：将内容设置为粗体。<u>内容</u>：将内容设置下划线。<i>内容</i>：将内容设置为斜体。<sup>内容</sup>：将内容设置为上标。<sub>内容</sub>：将内容设置为下标<blink>内容</blink>：将内容设置为闪烁（非标准元素）。列表标签在网页制作过程中，常常要将某些信息以列表的方式列举出来，这就需要用到HTML中的列表标签。列表标签分为两种，一种是有序的，一种是无序的。<ul>内容</ul>，表示它所包围的内容是无序列表标签，即列表中每一项目前不会加上序号，而是会加上●、○、■等符号。其中列表的每一项用<li>列表项</li>标示。<ol>内容</ol>表示有序标签，意义与使用方法和无序列表标签大致相同，不同点为它会在每个列表项前加上数字表格标签表格基本设计编写表格所用到的标签如下：<table></table>：定义表格，表格的所有内容都写在这个标签之内<caption></caption>：定义标题，标题会自动出现在整张表格的上方<tr></tr>：定义表行<th></th>：定义表头，包含在<tr></tr>之间，表头中的文字会自动变成粗体<td></td>：定义表元(表格的具体数据)，包含在<tr></tr>之间表格标签以下为制作表格的标签中大多拥有的公共属性：align：水平布局方式，常用属性值有left，right，center，表示左对齐，右对齐和居中对齐，<table>的该属性表示表格在页面的布局方式，<tr>、<td>的该属性表示该行和该表元内的内容的布局方式。默认布局方式为左对齐bgcolor：设置背景颜色border：设置边框的宽度，属性值为整数，为0时表格没有边框，默认值为0width：宽度，默认单位为像素，也可以使用百分制单位height：高度，默认单位为像素；也可以使用百分制单位表格标签对于整张表格，<table>标签常用的属性有以下几个：bordercolor：表格边框的颜色，默认为黑色cellpadding：表元边框的宽度cellspacing：表元的边框与表格边框之间的宽度合并单元格合并单元格必须对<td>标签中的rowspan、colspan进行设置，属性值都为整数，默认为1，表示没有合并。这两个属性的意思分别为：从该表元起，该表元在行或者列上占有的单元格数，比如设置某个<td>标签rowspan=2，表示该表元及其下面的表元合并成一个。链接和图片标签链接标签可以使用户链接到另一个页面，它的写法是<a>内容</a>，标签内的内容为链接所显示的内容，可以是文字、空格占位符、图片等，此标签的一个重要属性是：href，它的值表示链接所指向的资源地址链接和图片标签图片标签比较重要和常用的标签有以下几个：src：表示图片储存的位置width，height，border，align：作用与前文所提到属性相同alt：当图片未载入或者载入失败时提供的替代性的文字说明表单标签很多网页上，可以让用户在一些控件中输入一些内容，如文本框、密码框等，输入之后，提交，这些控件所在的区域叫做表单(form)。表单中的控件叫做表单元素。一个表单是这样组成的：<formaction="提交地址"> 表单内容（包括按钮、输入框、选择框等）</form>表单标签表单最基本的标签是<input>标签，该标签可以用来显示输入框和按钮等表单元素。它的属性type决定了表单元素的类型，可以为以下的值：text：文本框，text也为type的默认属性password：密码框radio：单选按钮，可以将多个单选按钮的name属性设置相同，使其成为一组。checked属性可设置默认被选checkbox：复选框，checked属性可设置默认被选表单标签

reset：重置按钮，按下之后，所有的表单元素内容变为默认值button：普通按钮submit：提交按钮，按下之后，网页会将表单的内容提交给action设定的网页，action的值为空时提交给本页image：图片，但是点击它的效果与提交按钮一样，都会提交表单表单标签表单中其他类型的表单元素还包括多行文本框和选择菜单等。<textarea></textarea>表示多行文本框，可用rows属性表示其行数，cols属性表示其列数。<select></select>表示下拉菜单，其中的选项使用<option>选项内容</option>表示，multiple属性可将其设置为可多选，size属性的值为下拉菜单的显示的项目数。框架框架的写法如下：

<framesetcols="30%,70%"> <framesrc="left.html"noresizescrolling="no"name="left"></frame> <framesrc="right.html"noresizescrolling="no"name="right"></frame> </frameset>框架<frameset></frameset>的属性有：rows：横向分割网页。属性值决定了分割页面之间的宽度的比值。cols：纵向分割网页。属性值决定了分割页面之间的长度的比值。border：框架边框的宽度。当值为0时，

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

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

最新文档

评论

0/150

提交评论