[返回首页]
 
   
 

 

第二课 用表格实现网页布局

  笨笨熊/文

  在上一节中,你已经建立了一个属于自己的网站。

  既然网站有了,下面的问题就是建设网页了。

  要装点自然先照顾一下门面页:首页 index.html

  下面笨笨熊介绍一下建立网页的开端,也就是进行网页的整体布局设计。

  完成一个网页的制作,如何实现内容的合理分配是很重要的。而在网页中可以实现布局的包括表格和框架。

  在本节中先介绍用表格来规划网页的方法,也是设计网页中最重要的方法。

  1>Table / Draw Table,如果你的编辑界面中没有表格手绘工具 通过这个菜单你可以在窗口的最左边找到它们。 当然你也可以使用菜单命令来完成表格的绘制。不过毕竟用手绘工具比较方便一些。

  2>点击工具按钮区中左下的“绘笔”工具,这时鼠标在网页中会变成一只笔。直接在网页中拖动即可。

  3>当然表格包围的部分就是内容分布的地方了。

  现在你已经建立了一个整体的大表格了。

  4>要想很好的定位内容,还要对表格进行分割或行列的插入或是删除。

  5>在表格内右击:splits cells,在弹出的窗口中设定是:split into columns(分割成列)或是split into rows(分割成行),然后在下面的输入框中输入分割的数字:如2

  6>当然你还可以通过插入行列实现同样的效果。

  在表格内右击:insert column(插入列)insert rows(插入行)

  7>再有就是完成表格单元的合并。

  用鼠标选定需要合并的两个或是更多的单元格 右击:选merge cells

  8>通过上面的操作你已经对单元格的操作有所了解了

  下面需要的就是关于单元格及表格属性的设定了。

  9>先看看表格整体属性的设定。

  在表格内右击,在随后弹出的菜单内选Table properties(表格属性)

  Float:left/right:设定表格在网页中的位置。

  Border size:边框宽度:可以设为0

  cell padding:表格单元到表格边框距离。可以为0

  cell spacing:表格内容到表格单元的距离,可以为0

  background color:在这里你可以使用背景颜色或是直接使用背景图片。

  border color:在边框不为0的情况下的颜色。

  右边的height 和 width是表格单元的高度和宽度。

  另外在指定表格宽高时,你可以选择使用像素Pixels或是比例显示percent,它们将控制在IE浏览器窗口没有完全打开时的网页显示效果。

  10>下面说说单元个的属性设定。

  其实单元格的属性主要是关于单元格内容的位置定位问题。

  除了关于单元格背景的设定外,很重要的一点是单元格内容的位置,通过两个属性来实现的:

  hori(简写):定位内容的左右分配的。

  vertical:定位内容的上下分配的。

  其他的就是类似表格设置中的边框颜色。

  等等了。

  好了,想想关于表格的问题基本上就这些了。

  以后的工作只有你自己努力了。

上一页  目录  下一页

 

Copyright 2000-2015 Gogusoft Software Co.,Ltd
 
 

销售电话:
043188833276(长春) 0755-32978958 (深圳)
电子信箱:销售gogusoft@sina.com  技术 8833276@126.com  招聘 gogusoft@126.com
公司地址:长春市绿园区长白公路7777号  邮编:130012