Dreamweaver制作简单网页【网页制作软件dreamweaver】

一、Dreamweaver cs3 制作简单网页

1、网站制作的流程大致分设计、制作和测试三个阶段~设计阶段,需要确定网站有哪些导航栏目,哪些页面,以及确定网站风格!制作阶段分页面制作和程序制作两个阶段、页面制作,就是把设计图转换成代码编辑的页面(静态页),程序制作就是把页面中的数据制作成程序语言输出的形式,并且把静态页面整合优化!测试阶段,主要测试网站的浏览器兼容性,程序的安全性,代码的规范程度!。

二、如何用Dreamweaver新建一个简单的网页

1、打开Dreamweaver,在左上角找到一个文件按钮,点击文件按钮。。

2、在弹出的菜单中,选择新建。。

3、在弹出的对话框中选择新建的页面类型,既然是网页就选择html的。。

4、选择完成页面类型了,就点击创建按钮。。

5、在生成的代码中,我们在body标签中填写内容“我的第一个网页”。。

6、然后用快捷键ctrl+s或者在左上角的文件按钮点击保存。。

7、保存选择保存的路径及保存的文件名称,我们先命名为index.html。。

8、在保存路径下面找到这个文件,双击打开。。

9、在浏览器中可以查看到我们新建的第一个网页。。

三、如何使用DW建造一个小网站?

1、首先,我构思了一个关于梅西的网站,然后就去网上下载一些素材。还可以用word做一些艺术字,当然会PS的话就更棒了。。

2、准备好素材,就可以先来建造一个主页了。其中主要用到的就是DW的表格,插入指令,具体参见其他经验。。

3、主页建造结束,用相同的方法建造其他网页,然后将所有的网页保存到一个文件夹里。。

4、再此回到DW的操作面板。给所有的网页之间建立联系,即超链接。在DW中,先选中目标,下面以“简介”为例。1选中“简介”,2右键选择“创建链接” 在选择文件中找到你所保存的网页。确定。这样两个网页之间的单向链接就建立了。 再用相同的方法对各个网页进行超链接,一个简单的网站就建造完成了。。

四、如何用Dreamwaver制作一个简单网页

1、打开Dreamwavercs设置站点在D/201511202建立新网页HTML。。

2、输入文字“人类的伙伴—狗”,设置ccs规则的选择器类型。。

3、插入背景。在“页面属性”-“背景图像”插入背景。。

4、设置表格。在“插入”-“表格”选择7行3列,经过“合并单元格”等调整,制作好表格。插入图片。选择“插入”—“图像”在文件夹中选中需要的图片,点击确定。。

5、插入音乐。选择“插入”—“媒体”—“插件”—选择所需音乐—“确定”。在“插件”中调整参数为“hidden”,数值为“TRUE”。。

6、保存网页为index.html。这样主页面就做好了。。

7、接下来做页面二“狗狗品种介绍”。利用上述方法将表格和图片插入并输入文字内容。插入“表单”。选择“插入”—“表单”,在“表单”选中区域内插入“表格”,然后在合适位置插入“列表”“单选按钮组”和“按钮”。。

8、保存网页二为“狗狗品种介绍.html”。。

9、然后做页面三“狗狗逗趣视频”,利用上述方法将表格和图片插入并输入文字内容。插入视频。选择“插入”—“媒体”—“FLV”—“累进式下载视频”—“URL”—“检测大小”—“确定”。注意:将Flash播放器放到文件夹内才能播放。。

10、保存网页三为“狗狗逗趣视频.html”。。

11、.然后做页面四“狗狗优点贡献”,利用上述方法将表格和图片插入并输入文字内容。保存页面四为“狗狗优点贡献.html”。。

12、创建超链接。在网页上选中文字—“插入”—“超级链接”—“文件”—“目标”为-blank。。

五、如何使用dreamweaver制作网页

1、打开Dreamwavercs设置站点在D/201511202建立新网页HTML。

六、Dreamweaver网页制作初级教程:样式的编辑

1、今天我们看一下,div格式的统一编辑方法。首先我们任意打开一个网站,看一下小编的例子。下图小编每一个框,其实都是一个div格式的范例。。

2、然后,那么我们会横着分,竖着分怎么分呢,比如下图这样,一个div中间再有其他竖向的div,应该如何来分呢?。

3、接下来,在上次课的基础上,我们来看一下,这个整体的样式是如何进行编辑的。。

4、我们首先看一下,样式的定义方法,对当前页面来说,样式的语句是:放在标题下方。。

5、下边可以输入任意我们自己定义的样式语句,比如我们想要自己的样式名字叫做:sgtjmovie当然这个名字可以随意起,我们只需要输入语句:.sgtjmovie{}。

6、大括号中间是我们需要定义的样式规则。需要写入相应的语句,比如:我们将下方的属性复制上来width:600px;height:20px;border:solid;margin-left:auto;margin-right:auto。

7、那我们看一下样式的调用方法,首先我们删除123表格的属性,然后,在1之后输入代码:class="sgtjmovie"看效果。

8、当然,我们可以将三个表格调用同样的样式来实现。。

9、怎么样,是不是更方便了。。

七、怎么用dreamweaver制作网页

1、Dreamweaver这一款专业的网页制作软件,相信相关专业的人员都不会陌生。

2、可以说,它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。

3、这里西西给大家带来一个dreamweaver制作网页的教程,初学DW的朋友可以参考一下。

4、定义站点在任意一个根目录下创建好一个文件夹(我们这里假设为E盘),如取名为MyWeb。

5、***备注、网站中所用的文件都要用英文名。

6、打开Dreamweaver,选择“站点—新建站点”,打开对话框。

7、在站点名称中输入网站的名称(可用中文),在本地根文件夹中选择刚才创建的文件夹(E、web)。

8、然后确定即可。

9、***备注、再次打开Dreamweaver,会自动找到刚才设立的站点。

10、如果有多个站点,可以在菜单“站点—打开站点”中去选择。

11、创建页面在本地文件夹E、MyWeb下面的空白处,按右键选“新建文件”,这样就建好了一个页面,默认的文件名为untitled.htm。

12、htm就表示这个网页文件是一个静态的HTML文件。

13、给它改名为index.htm。

14、***网站第一页的名字通常是index.htm或index.html。

15、其它页面的名字可以自己取。

16、双击index.htm进入该页面的编辑状态。

17、在标题空格里输入网页名称,按右键选页面属性,打开“页面属性”窗口。

18、在这里可以设置网站的标题、背景颜色或背影图像,超级链接的颜色(一般默认即可),其他都保持默认即可。

19、此时光标位于左上角,可输入一句话,如“欢迎来到我的主页”。

20、选取文字,用菜单“窗口/属性”打开属性面板,选取文字大小为再使文字居中,然后在文字前用几个回车使其位于页面中间。

21、如要选取字体,则选择字体中的后一项、编辑字体列表。

22、然后在对话框中选+号,接着在“可用字体”栏中选择需要加入到字体列表中的一种字体,点击中间的按钮就可以加入了。

23、***在网页上常用的是宋体字。

24、不要将特殊的字体加到列表中使用,因为别人电脑上未装就看不到。

25、如果需要用的话,要做成图片后再使用。

26、***在网页上打入空格的办法是、把输入法调为全角。

27、***在网页上换行的办法是、shift+Enter。

28、只按Enter则为换段。

29、为页面添加图片在本地文件夹E、MyWeb下面的空白处,按右键选“新建文件夹”,这样建立了一个文件夹,用它来放图片,可以改名为tu或pic或images都可以。

30、用菜单“窗口/对象”打开对象面板,点击“插入图像”,在对话框里选要插入的图片。

31、如果会出现对话框、“你愿意将该文件复制到根文件夹中吗?”,必须选“是”,然后将它保存到刚建好的文件夹里。

32、选中该图片,打开属性面板,可以在上面为图片取名,重新设置图片的高、宽,拖住图片角上的点可以变大小。

33、按住shift键,再拖动角上的点,可以使图片保持宽高比例拉伸。

34、如要恢复这原始大小,则单击右下角的“重设大小”按钮。

35、“链接”可以直接在这里输入地址。

36、“替代”是图片的说明,即鼠标指向图片所显示的文字。

37、“边框”是图片边框宽度,“对齐”是对齐方式。

38、添加超级链接为文字添加链接。

39、比如,在页面上输入“我的文章”,然后将其选中,打开属性面板,在“链接”一格中,选择它所要链接到的页面即可。

40、后面一格“目标”我们一般常用的是self即打开的新窗口代替了现开的窗口。

41、或是选择blank即打开新窗口。

42、为图片添加链接与上面文字的链接同理,插入图片,然后在属性面板中的链接一格中选择即可。

43、****图片可以创建不同的多个链接。

44、方法如下、在属性面板中的“地图”一项下面有一些图形,比如点击方形,光标变成十字,在图片上画一个蓝色矩形的热区,此时在属性面板上可以为这个热区设置链接地址,鼠标指向会显示。

45、同样,再用圆形设置一个热区,就可以再为该图片设置其他链接了。

46、添加E-mail链接选中需要添加E-mail链接的文字或图片,打开属性面板,在“链接”一格中输入填写邮件地址。

47、格式如下、mailto、邮件地址。

48、注意中间不空格。

49、如果链接到浏览器无法打开的文件,例如exe、Zip等文件,那么浏览者在点击这个链接的时候,就会实现文件下载、或是在线播放的功能。

50、表格的使用点击插入/表格,打开表格面板进行设置。

51、行数、列数、宽度、边框等,“单元格填充”为单元格内侧与内容的距离。

52、“单元格间距”为单元格之间的距离,单位均为像素。

53、插入表格后,在表格的边框上点击一下,可以全选整个表格。

54、然后在下面的属性面板里可以进行各种设置。

55、把光标移到其中一个单元格,此时看到的属性面板,就是单元格的属性面板。

56、也可以进行各种关于单元格的操作。

57、如背景色、背景图、边框、合并、拆分等。

58、关于表格的其他操作一制作细线表格原理、选中整个表格,设置其背景为黑色(该颜色即表格线的颜色)。

59、选中所有单元格,设置其背景为白色。

60、二自动格式化表格先制作好一张表格,然后选中。

61、选菜单中的命令/格式化表格。

62、即可以其中选择预设好的一些表格样式。

63、三一像素分割条插入一个1行1列,宽为200像素,边框边距均为0的表格。

64、选中表格,设置表格高为1像素,并设置一个背景色(即所要的线条颜色)。

65、切换到代码和设计窗口,将代码删除。

66、用表格构建完整的页面一网页顶部(一般包括图标、广告、导航菜单)创建一个1行2列,宽为760像素,边框及边距均为0的表格。

67、选中表格,设置排列方式为居中对齐,背景色为#3366CC。

68、将光标置于左边单元格中,设置其水平排列为左对齐,垂直排列为顶端对齐,然后插入一张图像,一般在此插入的是网站的图标,即logo。

69、将光标置于右边单元格中,设置其宽度为500,水平排列为居中对齐,垂直排列为中间,然后插入图像,一般是网页广告,即banner。

70、将光标置于刚完成的表格之后,插入/表格,创建一个1行1列,宽为760像素,边框及边距均为0的表格。

71、选中刚创建的表格,设置排列方式为居中对齐,背景色为#005173。

72、在该表格中依次插入多个图像,作为导航条菜单。

73、二网页中部(左边栏目列表、中间网站新闻、右边栏目列表)在导航条表格后面,插入/表格,创建一个1行3列,宽为760像素,边框及边距均为0的表格。

74、并设置排列方式为居中对齐,背景色为#FFFFFFF。

75、将光标置于左边单元格中,设置其宽度为18%,水平排列为居中对齐,垂直排列为顶端对齐,然后插入一张图像,插入一个导航条。

76、将光标置于刚插入的图片后,插入/表格,插入一个12行1列,宽为90%的表格。

77、设置其单元格间距为背景色为#CCCCCC。

78、将光标放在表格第一个单元中,设置其高为背景色为#FFFFFF。

79、插入/图像,插入一个导航文字前面的小点。

80、同样设置其他11个单元格,这样左边的栏目分类列表就完成了。

81、将光标置于主体表格的中间单元格中,设置其宽度为66%,水平排列为居中对齐,垂直排列为顶端对齐,然后插入/图像,插入一个导航条。

82、将光标置于图像后,插入/表格,插入一个4行1列,宽为95%的表格。

83、设置其单元格间距为背景色为#CCCCCC。

84、将光标置于表格的第一个单元格中,拖动鼠标,将4个单元格都选中,设置高为背景色为#FFFFFF。

85、将光标置于主体表格右边的单元格中,设置其宽度为16%,水平排列为居中对齐,垂直排列为顶端对齐,插入/图像,插入一个导航条。

86、将光标置于图像后,插入/表格,插入一个7行一列,宽为90%的表格。

87、设置其间距为背景色为#CCCCCC。

八、怎么用dreamweaver制作网页

1、Dreamweaver这一款专业的网页制作软件,相信相关专业的人员都不会陌生。

九、DreamWeaver CS6网页制作教程:[1]创建站点

1、打开DreamWeaverCS关于DreamWeaverCS6的下载、安装及破解,在我早先的一个经验中有写道,需要的同学可以看下。。

2、选择“站点”>“新建站点”命令,打开“新建站点窗口”。。

3、设置新站点的信息,“站点”项用来设置站点名称和本地站点文件夹。。

4、“服务器”项用于动态网站的构建。静态网站并不需要。点击“+”,来添加一个服务器。。

5、调试网站我们一般“连接方法”选择“本地/网络”。“服务器文件夹”选择你安装的服务器位置,一般在C盘(我安装的AppServ,则在C:AppServwww文件夹)。因为站点文件夹在服务器主目录下的“yige”,所以“WebURL”设置为“localhost/yige”。。

6、勾选服务器的“测试”。。

7、“版本控制”和“高级设置”项需要修改的很少。因此不再多说。。

转载请注明出处阿文说说网 » Dreamweaver制作简单网页【网页制作软件dreamweaver】