• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >Dreamweaver教程 > Dreamweaver CS6制作一个新闻网页首页的实例教程

Dreamweaver CS6制作一个新闻网页首页的实例教程

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含Dreamweaver,网页等相关知识,佚名 希望在学习及工作中可以帮助到您

以实例说明Dreamwaver CS 6版本的应用。即使现在用很多有关DreamwaverCS6版本的书籍资料,但是资料太过复杂,反而不知道从而下手。这篇经验将以本人经验说说Dreamwaver CS6 的使用。这里举的例子是“新闻网页首页”的制作。

1、打开DW,DW界面如图

2、分析所制作的网页的需求,明确目标

3、明确需求。如果是建议一个网站,需要建立一个站点,方便管理并使制作步骤更为有条理。

4、新建站点弹出来的窗口。在这里我输入的是“新闻网页”,放在Dreamwaver CS6文件夹下的新闻网页文件夹

5、在新闻网页文件夹下新建“images”文件,导入制作网页所需要的素材,这里所需要的素材都是图片

6、新建HTML,选择“创建”

7、在“标题”中输入“新闻网页首页”,转换到“设计”界面

8、根据制作网页需求插入表格,只是在行列有所变化,下面的“表格宽度”以下选项根据图设置

9、插入表格如图,选择表格,会看到表格边框变红,选择之后变黑。在属性中对齐选项选择“居中对齐”

10、在表格第一行第一列输入“用户名”,在第一行第二个表格插入“文件域”。然后是密码,同样的插入“文件域”。切换到“拆分”界面,选中密码对应的“文件域”,将“type”改为“password”

11、插入图像,不知道怎么填的话就一直选择“确定”即可

12、插入按钮,同上面插入图像的处理方法那样处理,如果不知道填什么就一直“确定”,无妨。在属性栏里的值改为“登录”。然后插入图像“谷歌logo”,附上效果图

13、选中第二行,点击鼠标右键,选择“表格”,“合并单元格”

14、在第二行插入图片。完成页面制作。保存HTML文件。然后在站点“新闻网页”可以看到保存的HTML文件

15、点击制作好的HTML文件,选择用360浏览器打开,输入用户名和密码,然后会看到如下情况:用户名课件,密码不可见,符合实际

16、当然也可以在Dreamwaver CS6 的实时视图中完成第15步

相关推荐:

Dreamweaver编辑网页预览的时候显示乱码该怎么办?

Dreamweaver怎么新建站点地图?dw编辑站点地图的方法

怎么格式化html代码? Dreamweaver格式化html代码的技巧

您可能想查找下面的文章:

  • Dreamweaver工作区布局有哪些工具?
  • dreamweaver状态栏的工具该怎么使用?
  • dreamweaver怎么批量替换超链接?
  • Dreamweaver预览提示浏览器指定位置已不存怎么办?
  • Dreamweaver网页中怎么制作锚点链接?
  • Dreamweaver怎么给网页添加下拉的条幅?
  • dreamweaver命名锚记怎么使用?
  • dreamweaver cs5不写写代码怎么添加meta标签?
  • Dreamweaver怎么怎么利用层布局网页?
  • Dreamweaver站点怎么检查链接错误?

相关文章

  • 2017-08-06用Dreamweaver制作网页中常用的过渡效果
  • 2017-08-06Dreamweaver预览提示浏览器指定位置已不存怎么办?
  • 2017-08-06Dreamweaver怎么更改网页默认浏览器?
  • 2017-08-06dreamweaver cs5不写写代码怎么添加meta标签?
  • 2017-08-06Dreamweaver CS3网页制作之CSS布局规则
  • 2017-08-06小技巧:Dreamweaver的应用源格式
  • 2017-08-06dreamweaver cs6怎么汉化 dreamweaver cs6汉化教程
  • 2017-08-06dreamweaver中怎么将文字放到图片上?
  • 2017-08-06dreamweaver8调出新建、打开两个命令的快捷工具栏
  • 2017-08-06dw怎么制作asp动态网页之向数据库增加记录?

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • Dreamweaver中不能输入多个空格的解决办法
    • DW怎么设置网站的背景图像?
    • Dreamweaver怎样制作禁止页面缓存
    • Dreamweaver光标的落位总是不准怎么办?
    • 怎么格式化html代码? Dreamweaver格式化html代码的技巧
    • dw怎么新建站点?新建站点四种方法图解
    • Dreamweaver图文教程教大家轻松制作超酷的Flash相册
    • DreamWeaver中批量删除超级链接的方法(图文)
    • Win2003系统安装dreamweaver cs4的方法
    • Dreamweaver基础教程之主体的细分技巧

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有