您现在的位置: 圆点视线 >> 教程 >> 网页设计 >> html教程 >> 文章正文
[图文]Html语言教程           ★★★
Html语言教程
作者:DEDS深度  文章来源:DEDS深度  点击数:  更新时间:2007-10-3 23:29:28 
 页面功能:【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口 【字体:

 

第五章:表格(Table)
  表格的基本形式
  一个表由<table>开始,</table>结束,表的内容由<tr>,<th>和<td>定义。<tr>说明表的一个行,表有多少行就有多少个<tr>;<th>说明表的列数和相应栏目的名称,有多少个栏就有多少个<th>;<td>则填充由<tr>和<th>组成的表格。是否用表格线分开为部分内容用border属性说明,下面是一个有表格线和一个元表格线的表及其输出。

   有通栏的表
1、有横向通栏的表用<th colspan=#>属性说明colspan表示横向栏距,#代表通栏占据的网格数,它是一个小于表的横向网格数的整数。 2、有纵向通栏的表用rowspan=#属性说明。
    rowspan表示纵向栏距,#表示通栏占据的网格数,应小于纵向网络数。需要说明的是有纵向通栏的表,每一行必须用</tr>明确给出一横向栏目结束,这是和表的基本形式不同的。

  表的大小,边框宽度,表格间距
  1、表的大小用width=#和height=#属性说明。前者为表宽,后者为表高,#是以象素为单位的整数。
  2、边框宽度由border=#说明,#为宽度值,单位是象素。
  3、表格间距即划分表格的线的粗细用
  cellspacing=#表示,#的单位是象素,下面的例子将表格间距定义为10个象素,它看起来象用很粗的线划分的表格。

  表中文本的输出
  1、文本与表框的距离用cellpadding=#说明。下面的例子使表的内容与表框离开10个象素。2、表格的后度大于其中的文本后度时,文本在其中的输出位置与用align=#说明。
  #是 left,center和right三者之一,分别表示左对齐,居中和右对齐,align属性可修饰<tr>,<th>和<td>链接签。3、表格的高度大于其中文本的高度时,可以用valign=# 说明文本在其中的位置。#是top,middle,bottom,baseline四者之一。分别表示上对齐,文本中线与表格中线对齐, 下对齐,文本基线与表格中线对齐,特别注意的是baseine对齐方式,它使得文本出现在网格的上方而不是相象中的下半部。同样,valign可以修饰<tr>,<th>,<td>中的任何一个。

  浮动表格
  所谓浮动表格是指表与文件中重中内容对齐时,若在现在位置上不能满足其对齐方式,表格含上下移动,即“挤开”一些内容,直到满足其对齐要求。
  浮动属性一般由align=left或right指定。
  下面的例子也可以看出,cllign=left时把字符串“挤到”了表的右边。当右边空间不够时,该字符串会显示在表的下在边,看起来象是表“浮”到了字符串上。

  表格颜色
表格的颜色用bgcolor=#指定。
  #是16进制的6位数,格式为rrggbb,分别表示红、绿、兰三色的分量。或者是16种已定义好的颜色名称,参见文本颜色。
  <table border>
<tr><th bgcolor=000000>
<font color=ffffff>Food</font></th>
<th bgcolor=whit>Drink</th>
<tr><td bgclor=ffaaaa>A</td><td>B</td>
</table>

第六章:分框 Frame
  分框的基本格式
  分框将流览器的窗口分成多个区域,每个区域可以单独显示一个html文件,各个区域也可相关连地显示某一个内容,比如可以将索引放在一个区域,文件内容显示在另一个区域。
  分框的基本结构如下
    <html>
<head>
<title>...</title>
</head>
<noframes>...</noframes>
<frameset>
<frame src="url">
</frameset>
</html>
<nframes>...</noframes>中的内容显示在不支持分框的浏览器窗口中,因而这里指向一个普通版本的html文件,以便使用不支持分框浏览器的用户阅读。
  分框由<frameset>指定,并且可以嵌签,分区中种部分显示的内容用<framre>指定。
  需要说明的是,frame是一个新出现的元素,许多流览器不支持它。
  可以将窗口横向分成几个部分,也可以分成纵向几个部分,还可以混和分框。

  横向分框
  横向分框用<frameser cols=#>指定,#可以是一个百分数,也可以是一整数。前者规定各框占窗口的百分数,后者指定各框的绝对大小。例如,下面的例子将窗口分成30%、20%、50%的几个区域,各区域的内容分别为A.html,B.html,C.html.

  纵向分框
纵向分框用<frameset cols=#>指定。

  混合分框
将窗口分成横纵几个区域时,用<framset>代替<frame>链接至即可将原的分好的<frame>区域再次分框, 下面的例子先将窗口分成20%,80%, 然后将右边的区域再分成分别占40%和60%的上下两个区域。
  分框与框中文本的间距
分框与其中的文本间距可以用Marginwidth=#和marginneigh=#来指定,前者指定文本与分框的边缘的横向距离,后者为纵向距离,其单位都为象素,下面的例子中,将右边分框的左右边距,上下空白都设为50个象素。
  分框间的关联
分框之间可以有特定的关联,比如将某一框的内容输出到另一个框,这样我们就可以把其中一个框作为输出框,另一个框作为选择框。实现这种关联需要做下列的事情。
  ①在分框的hrme文件中标记各个框,标记的方法是在<frame>中加入name属性,比如上例,定义左边的框为输出,右边框为象引。
    <frame src="A.html"name=display>
<frame src="B.htme"name=index>
②在B.html文件中指定输出到哪个框方法是在B.html文件中加入下列一行。
    <base target="display">这便得用鼠标点取B.html中的链接指针,它的输出会显示在左边的框中。

上一页  [1] [2] [3] [4] [5] [6] 

 【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】 文章录入:Rainsion    责任编辑:Rainsion  【字体:
 
  • 上一篇文章:

  •  
  • 下一篇文章:
  • 最新文章
    相关文章
    Dreamweaver超级技巧(中)
    Dreamweaver超级技巧(下)
    Dreamweaver滑动菜单的制作
    Dreamweaver MX应用表格排序
    Dreamweaver的技巧锦集17条
    Dreamweaver技巧大放送前六招
    使用Dreamweaver制作网页事如何使用库
    简单实用的网页表格特效
    DW MX实例:极酷的鼠标外观
    DW MX实例:个性化 IE 滚动条
    网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)
    发表评论:
     姓  名: 评 分: 1分 2分 3分 4分 5分
     评论内容: ·严禁发表危害国家安全、政治、黄色淫秽等内容的评论。
    ·用户需对自己在使用本网服务过程中的行为承担法律责任
    ·本站管理员有权保留或删除评论内容。
    ·评论内容只代表机友个人观点,与本网站立场无关。
     
    最 新 推 荐
     
    百度主题推广
    最 新 热 门