如何用Dreamweaver制作网页表格

作者&投稿:於唯 (若有异议请与网页底部的电邮联系)
如何用Dreamweaver制作网页表格~

 1、在插入栏中选择

  按钮或“插入”菜单>选“表格”。系统弹出表格对话框如下图。这些参数我们都已经认识了。行:2。列:2。其余的参数都保留其默认值。。

  Dreamweaver网页制作教程:表格设计

  2、在编辑视图界面中生成了一个表格。表格右、下及右下角的黑色点是调整表格的高和宽的调整柄。当光标移到点上就可以分别调整表格的高和宽。移到表格的边框线上也可以调整。(如下图)

  Dreamweaver网页制作教程:表格设计

  3、在表格的第一格按住左键不放,向下拖拽选中二格单元格。(如下图)

  Dreamweaver网页制作教程:表格设计

  然后在展开的属性面板中选择合并单元格按钮(如下图红框所示)。将表格的单元格合并。如果要分割单元格,则可以用合并单元格按钮右边的按钮。

  Dreamweaver网页制作教程:表格设计

  合并结果如下图。

  Dreamweaver网页制作教程:表格设计

  4、用鼠标拖拽表格的边框调整到适当的大小。

  5、单击左边的单元格,然后输入“摄影作品赏析”文字,并调整大小,因是竖排应每个字回车一次。如果需要调整格子的大小。只需要鼠标的光标移动到边框上拖拽即可。

  6、在右边上下单元格内分别插入图片和文本。页面的基本样子有了。

  Dreamweaver网页制作教程:表格设计

  7、光标移动到表格的边框上单击。表格周围出现调整框,表示选中整张表格。然后,在属性面板中将“边框”值设置适合的值,如果为0,边框在编辑状态,为虚线显示,浏览时就看不见了。

  一个符合要求的页面在表格的帮助下做好了。

  通过上面的操作我们对于表格有了一个初步的认识。还要提示一点,对整幅表格操作和对一个单元格操作的时候,相应的属性面板是不同的。

  表格颜色设置,选择整幅表格后,利用属性面板的颜色选择器设置背景色。单元格也可单独设置。鼠标在需要设置的单元格点一下,其余操作同上。

  下面我们就来看看这些属性面板的区别。

  表格的属性面板,要出现这个面板必须先选中整幅表格,方法上面已经提到过了。您可以在众多选项中填入需要的参数。如下图:

  Dreamweaver网页制作教程:表格设计

  选中了单元格之后属性面板就发生如下变化了。选择行或者列都属于选中单元格。如下图:

  Dreamweaver网页制作教程:表格设计

  对表格操作的几种常用方式:

  合并:将选中的连续单元格合并成为一个单元格。

  分割:将一个单元格分割成若干单元格。

  水平对齐方式:分为(左)(中)(右)三种。

  垂直对齐方式:分为(顶)(居中)(居底)(基线对齐)

  表格还可以增加或者删除行或者列。在一个单元格中单击鼠标右键。在右键菜单中选择表格选项>>选择“插入行或列”。系统会弹出对话框如下。

  Dreamweaver网页制作教程:表格设计

  在对话框里填入数据即可。最后要说的是选中表格中的各种元素的方法:

  选中一行,把光标移到该行的最左边单元格的左面,光标会变成箭头状。单击就可以选中一行。

  选中一列,把光标移到该列的最上边单元格的上面,光标会变成箭头状,然后单击可以选中一列。

  选中整张表格,把光标移到表格的左上角或右边框或下边框线上。单击即可选中整幅表格。选中的表格会在周围出现一个黑框表示整张表格选中了。请看如下示意:

  选中单元格。单元格可以同时选中多个。选择连续的单元格,光标先选中的一个单元格,按shift键不放,选取最后一个单元格。选不连续的单元格。按住Ctrl键,点取所需要的单元格即可。

用Dreamweaver制作网页表格操作如下:1.新建一个html 文档;
2.插入表格,几行几列自己设定;


3.设置表格边框宽度;

效果预览:

一、要想用Dreamweaver来制作网页,首先要安装Dreamweaver网页制作的工具,这是必备的,可以去官网里面去下载即可。

二、操作步骤:

【1】第一步是打开Dreamweaver工具。

【2】然后在Dreamweaver选项的中,选择新建一个Html文件,这个是制作网页的前提。

【3】进入Dreamweaver主界面后,我们可以看到自动生成的标题、头、身体的相关的代码的出现,这个是软件自动生成的,可以直接使用的。

【4】在Dreamweaver代码的主界面中,在代码、拆分、设计这三个选项卡中,选择拆分,因为这样可以更好的看到代码与相关设计的表格的调整的问题。

【5】然后选择插入中的表格的选项,这个是用来选择表格的选项的。

【6】选择表格的选项框出现后,然后根据个人的需要,可以选择表格的行与列,还可以选择相关的标题、摘要,这里就选择五行五列。

【7】当点击确定后,就能够看到左边的代码区域,右边的相关表格的区域。

【8】表格制作好后,可以根据个人的需要对表格进行调整大小,可以通过鼠标的拖动来调整表格的大小。

【9】还可以在代码中调整网页表格的大小,对表格的长与宽进行相关的调整,可以修改长与宽的值的大小。

【10】最后一定要记得保存哦,保存的文件是以html为后缀名的。

【11】文件保存好后,可以在Dreamweaver页面中按F12来浏览你做好的网页表格。



1、了解表单标签意义

表格


描述

<table>    
定义表格    

<caption>    
定义表格标题。    

<th>    
定义表格的表头。    

<tr>    
定义表格的行。    

<td>    
定义表格单元。    

<thead>    
定义表格的页眉。    

<tbody>    
定义表格的主体。    

<tfoot>    
定义表格的页脚。    

<col>    
定义用于表格列的属性。    

<colgroup>    
定义表格列的组。    

2、撰写代码

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td></td>
<td>row 2, cell 2</td>
</tr>
</table>

3、浏览器会这样显示:



打开Dreamweaver后在菜单栏找到插入,然后找到表格

如何用dreamweaver制作网页
答:在开始制作之前,我们先对这个页面进行一下分析。看看这个页面用到了哪些东西。□网页顶端的标题“我的主页”是一段文字。 □网页中间是一幅图片。 □最下端的欢迎词是一段文字。 □网页背景是一深紫红颜色。构思好这个网页的结构,我们就可以开始制作了。首先启动Dreamweaver,确保你已经用站点管理器建立...

如何使用dreamweaver
答:创建模板 你能从一个已存在的HTML文件创建一个Dreamweaver模板然后再去修改他以适应你的需要,或你能从一个空白的HTML文件从头创建. Dreamweaver模板创建后自动地被存贮在Templates目录中(这个目录就在你所定义的本地站点的根下面)。如果这个目录不存在的话,在创建新模板时Dreamweaver会自动创建一个Templates...

如何使用DreamWeaver做框架
答:工具原料:软件:dreamweaver。硬件:电脑。框架制作方法:1、打开软件DreamWeaver。2、选择框架集。3、弹出框架集中选择布局所需的即可。

如何用Dreamweaver创建导航条和状态栏
答:最下面是“ Insert”项,选框中有Horizontally(水平)和Vertically(垂直)两个选项。选中Horizontally为导航条水平,选中Vertically 为导航条垂直。 Use Table 项,选中后,Dreamweaver自动生成HTML代码将导航条各部位用表格隔开。当一个部位设置完成后,要添加其他部位,可点击对话框上方的“+”按钮,可按上面...

怎样用Dreamweaver套用网站源代码制作网页
答:用Dreamweaver套用网站源代码制作网页方法: 一、定义站点 1、在任意一个根目录下创建好一个文件夹(我们这里假设为E盘),如取名为MyWeb。 备注:网站中所用的文件都要用英文名。 2、打开Dreamweaver,选择“站点—新建站点”,打开对话框。在站点名称中输入网站的名称(可用中文),在本地根文件夹中选择刚才创建的文件夹...

dreamweaver怎么用,怎么使用Dreamweaver
答:Adobe Dreamweaver,简称“DW”,中文名称 "梦想编织者",是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器,DW是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。使用方法:1、下载安装...

如何使用Dreamweaver制作一个网页
答:这里西西给大家带来一个dreamweaver制作网页的教程,初学DW的朋友可以参考一下。 一、定义站点 1、 在任意一个根目录下创建好一个文件夹(我们这里假设为E盘),如取名为MyWeb。 ***备注:网站中所用的文件都要用英文名。 2、打开Dreamweaver,选择“站点—新建站点”,打开对话框。在站点名称中输入网站的名称(可用中文...

如何使用dreamweaver
答:由于本书后面讲解的是 ASP.NET 网络应用程序的开发,所以其开发之前,应该部署好 Dreamweaver 有关开发运行组件。效果说明 用 Dreamweaver 建立的站点“ Dreamweaver100 ”,该站点是第 75 例至第 90 例中玩具公司构建网站的站点。本例就是介绍这个站点的建立方法。

简述如何使用网页制作工具Dreamweaver创建网页
答:1、打开 Dreamweaver8。在“站点”菜单栏里选“新建站点”命令,在弹出对话框中点点选“高级”标签。2、在“站点名称”填上你起的站点名。在“本地根文件夹”栏里, 点右面的黄文件夹图标,在选择栏里找到你电脑的硬盘里刚建的站点文件夹并选中它。 点确定。!编辑页面有多种方法,如表格定位方法...

如何使用dreamweaver
答:首先启动Dreamweaver软件,在打开的导航首页中点击“新建HTML”:2 点击“文件”菜单,选择“保存”命令:3 在保存的对话中输入网页名称既可,再单击“保存”按钮:4 在进入的Dreamweaver网页页面中,可以先打开的是源代码页面,这里可以点击最左上角的“设计”按钮返回“所见即所得”的设计界面:每个网页...