微软开发的网页设计工具Expression Web,作为网页设计工具FrontPage的替代品,在功能以及可扩展性方面都有了很大提升,它彻底解决了以前FrontPage会产生不标准网页代码的缺点,现在用Expression Web可以创建完全符合标准的网站,同时支持最新的CSS和层,具有强大的CSS功能,Expression Web支持asp.net2.0和XML,具有强大的数据库操作功能。通过这些新特性,Expression Web摆脱了以前FrontPage给设计人员造成的一种“玩具”印象,逐步走进了专业网页设计人员的视野。

Expression Web启动画面

下面我们就来了解一下这个网页设计工具的使用方法。

一、建立网站

Expression Web是一个强大的网页编辑和网站设计工具,在编辑具体的网页之前,我们首先要对自己的网站有一个总体的规划,设计网站的结构,然后再进行具体的网页编辑操作。在网站规划方面,我们既可以自己手工操作,也可以用Expression Web提供的模板来自动创建。

(一)建立普通站点

单击“文件→新建→网站”命令,打开“新建”网站对话框,在左边的窗口中选择“常规”,在右边的窗口中显示出要创建的网站类型。

只有一个网页的网站:创建只有一个单独的空白网页的新网站。

空白网站:创建一个没有内容的新网站。

单击“指定新网站的位置”右边的“浏览”按钮,可以选择网站保存的位置,最后单击“确定”按钮,一个新网站就建立好了。

(二)使用导入向导建立站点

这种方式可以创建一个网站,并将一个已建立的网站或某个文件(目录)导入到当前网站中,它采用向导式的操作,一步步引导用户完成网站的创建。

单击“文件→新建→网站”命令,打开“新建”网站对话框,在左边窗口中选择“常规”,在右边窗口中选择“网站导入向导”,然后单击“浏览”按钮,选择新网站的位置;单击“确定”按钮,出现“导入网站向导”对话框,用户可以选择导入文件的方式,有Http、Ftp、WebDAV、 FrontPage Server Extensions、文件系统五种方式,这里我们选择从本机上导入文件,所以选择“文件系统”,然后单击“浏览”按钮选择要导入的文件目录,单击两次“进一步”按钮,最后单击“完成”,出现“本地网站”和“远程网站”窗口,单击“远程网站”下部的“发布网站”按钮,将远程网站中的文件发布到本地网站中,在“文件夹列表”中就可以看到导入的文件内容。

(三)使用模板建立站点

Expression Web内置了多种站点模板,用户可以非常方便地用它创建一个自己需要的网站。

单击“文件→新建→网站”命令,打开“新建”网站对话框,在左边窗口中选择“模板”,在右边窗口中列出了模板网站的类型,有个人、单位、小型企业,选中某种类型,就可以在右边的预览区查看它的外观样式,单击“浏览”按钮,选择网站保存的位置,然后单击“确定”按钮,一个新网站就建好了。对模板中的各个页面适当修改就可以变成自己的网站,非常简单。如果用户创建的是单位或个人的小型站点,用这种方法最方便快捷。

二、创建新网页

单击“文件→新建→网页”命令,打开“新建网页”对话框,Expression Web可以创建“常规”、“asp.net”、“ css布局”、“样式表”、“框架网页”4种类型的文件,每种文件又包含很多种类型,在左边的窗口中选中一种类型,在中间的窗口中列出详细的分类,右边的窗口是预览区,可以预览一些网页的外观样式,选中要创建的网页类型,单击“确定”按钮即可。一般常用的文档类型在“常规”分类中都可以找到。

创建新网页

另外,单击工具栏“新建文档”右边的下拉按钮,在弹出菜单中选择“网页”选项,也可以打开“新建网页”对话框,当然也可以直接在弹出的菜单中选择要创建的网页类型,如HTML、ASPX、CSS。

可以通过以下方法随时预览编辑的网页,注意在预览前一定要先保存网页。

方法一:单击“文件→在浏览器中预览”命令,然后在展开的子菜单中选择浏览器和窗口大小。

方法二:单击工具栏中的“预览”按钮,或者单击按钮旁的箭头,在下拉框中选择浏览器和窗口大小。

方法三:直接按F12键。

三、创建超链接

超链接既可以是文字也可以是图片,既可以链接到网站内的网页,也可以链接到其他的网站、文件、程序或电子邮件。

1、选中要建立超链接的文本或图片,如果没有选择文本或图片,则目标URL显示为超链接文本。

2、单击“插入→超链接”命令或工具栏中的“插入超链接”按钮,弹出“插入超链接”对话框。

3、设置超链接的参数内容:

在“要显示的文字”框中输入超链接要显示的文本内容。

单击“屏幕提示”按钮,在弹出的对话框中输入屏幕提示文字,当你将鼠标移到超链接上时将显示该文字内容。

如果要链接到网站中的某个网页,请在“当前文件夹”列表中选中一个网页,如果要链接到外部网站,请在“地址”框中输入网站的网址。

单击“目标框架”,在弹出的窗口中可以设置网页的打开方式,如果希望在新浏览窗口中打开超链接,请选择“新建窗口”。

如果要链接到电子邮件地址,请选择“电子邮件地址”,然后在右边的窗口中输入“电子邮件地址”和邮件主题。

4、 设置完毕,单击“确定”按钮。

四、插入图片

将光标移到网页中要插入图片的位置,单击“插入→图片→来自文件”命令或直接单击工具栏中的“插入文件中的图片”按钮,打开“图片”对话框,选中所需要的图片文件,单击“插入”按钮,出现“辅助功能属性”对话框,在“替代文本”框中,输入在下载图形、找不到图形或网站访问者将鼠标移到图形上时为图形所显示的文本,若要添加较详细的说明,请单击“浏览”按钮,并选择一个文件,再单击“打开”按钮,当然你也可以选择不在“辅助功能属性”对话框中输入内容,单击“确定”按钮,图片就插入到网页中。

五、创建表格

在Expression Web中有两种方法创建表格。

(1)使用工具按钮插入表格

将插入点移到网页中要插入表格的位置,单击工具栏中的“插入表格”按钮,弹出一个表格窗口,向右下方拖动鼠标,表格框中就会显示表格的大小,表格大小满足要求时单击鼠标就会在网页中插入一张空表格。

(2)使用菜单命令输入表格

将插入点移到网页中要插入表格的位置,单击“表格→插入表格”命令,出现“插入表格”对话框,输入表格所需的“行数”和“列数”,然后在“布局”、“边框”、“背景”中设置好表格的其他参数,单击“确定”按钮,一个表格就出现在网页中。

六、创建框架网页

框架网页是一种特殊的网页,它本身并不包含可见内容,它只是一个窗口,里面包含多个框架,每个框架都可以显示一个独立的网页,多个框架之间还可以设置超链接,这些框架的集合,就称为框架网页。

单击“文件→新建→网页”命令,打开“新建”网页对话框,在“网页”选项卡中单击“框架网页”,在右边的列表中就可以看到程序内置的十种框架网页模板以及预览图,选择一种模板,单击“确定”按钮,就可以创建一个框架网页。

新创建的框架网页还没有任何内容,用户需要给每个框架来填充网页内容,有两种方法:

如果已经在网站中编辑了网页,可以单击框架中的“设置初始网页”按钮,打开“插入超链接”对话框,在文件列表中选中一个网页文件,也可以直接在“地址”栏中输入网址,单击“确定”按钮,就可以将网页插入到框架中。

如果还没有建立网页,需要给框架新建网页内容,请单击框架中的“新建网页”按钮,开始新网页的编辑。

七、创建样式表

利用Expression Web可以非常方便地创建样式表,用来设置网页及其内容的格式。

(1)创建外部样式表

单击“文件→新建→CSS”命令,新建一个样式表文件,然后单击“应用样式”任务窗格中的“新建样式”按钮,打开“新建样式”对话框,在“选择器”中选择要定义的标记,在“定义位置”下拉列表中选择“现有样式表”,在下面的“类别”区设置好各项参数,单击“确定”按钮,一个样式表就建好了,将它保存起来,以后就可以使用了。

(2)创建内部样式表

首先打开要创建内部样式表的网页,然后单击“应用样式”任务窗格中的“新建样式”按钮,在“新建样式”对话框的“定义位置”下拉菜单中,选择“当前网页”,在“选择器”中选择要定义的标记,同时在下面设置好各项参数,单击“确定”按钮,样式表就自动插入到网页中的

head>标记之间,我们可以转换到“代码”视图模式进行查看。

八、插入层

单击“任务窗格→层”命令,将“层”任务窗格显示在右下方的面板中,然后在网页中,将光标移到要插入层的位置,单击“插入→HTML→层”命令或在“层”任务窗格中单击“插入层”按钮,就可以在网页中插入一个层。

也可以在“层”任务窗格中单击“绘制层”按钮,然后用鼠标在网页中拖动就可以画出一个层。

九、添加动态网页效果

为了使网页充满活力,富于变化和吸引力,我们往往需要给网页添加上一些声音、动画、弹出窗口、网页过渡效果等特效,在Expression Web中我们可以不用写一句代码,就能轻松实现这些特效。

1、添加交互式按钮

将光标移到要添加按钮的位置,单击“插入→交互式按钮”命令,打开“交互式按钮”对话框,进行如下设置:

在“按钮”选项卡的“按钮”列表中,单击选择按钮样式,在“文本”框中,输入要显示在按钮上的文本,单击“链接”旁边的“浏览”按钮,在打开的“编辑超链接”对话框中找到并单击希望链接到的文件、URL或电子邮件地址。

在“字体”选项卡上,可设置各种按钮状态下文本的字体、样式、对齐方式及颜色。

在“图像”选项卡上,可设置要创建的图像的大小以及是否创建对应于各种按钮状态的图像。

各种参数设置完毕,单击“确定”按钮,一个交互式按钮就会出现在网页中。

2、添加网页过渡效果

Expression Web可以通过动态HTML技术让网页之间的转换变成动态的,当用户浏览网站时,从一个网页切换到另一个网页将出现淡入、淡出、擦除等不同的效果。

向网页添加过渡效果的具体操作是:打开要添加过渡效果的网页,单击“格式→网页过渡”命令,打开“网页过渡”对话框,在“事件”下拉菜单中选择要应用效果的事件,在“持续时间”中输入过渡效果持续的时间,在“过渡效果”列表中单击所需的过渡效果类型,最后单击“确定”按钮。

3、向页面元素添加行为

我们可以对整个页面、图像、文字、链接或者页面中的一个或多个元素添加行为,具体操作如下:

首先单击“格式→行为”命令,在右下角的面板中打开“行为”任务窗格,然后在网页中选中要添加行为的网页元素,如文本或图形,在“行为”任务窗格中,单击“插入”按钮,弹出下拉菜单,单击所需的操作,弹出设置对话框,对于不同的操作,对话框的内容不同,设置完毕,单击“确定”按钮。若要选择不同的事件,请在“事件”之下,单击默认事件右边的下拉箭头,在弹出的菜单中选中所需的事件即可。

十、发布站点

在发布网站之前,用户首先要申请网站空间,获得网站空间的ftp地址以及用户名和密码。

1、打开要发布的网站。

2、单击 “网站→远程网站”命令切换到远程网站视图。

3、在“远程网站”视图,单击“远程网站属性”按钮。

4、打开“远程网站属性”对话框,在“远程网站”选项卡中选择一种服务器类型。由于大多数网站都是采用FTP方式上传文件,所以我们选择“FTP”,然后在“远程网站位置”中输入FTP地址,在FTP目录中输入上传的目录,不输入目录时将默认上传到网站的根目录下。

5、单击“确定”按钮,输入网站的用户名和密码。

6、单击“确定”按钮,打开远程网站。在“远程网站”中选中要发布的目录,双击可以打开它。

7、在“远程网站”窗格中的“发布所有更改过的网页”之下,选中“本地到远程”选项。

8、在“本地网站”窗格中,右键单击不希望发布的每个文件,在弹出的快捷菜单中再单击“不发布”命令。

9、单击“发布网站”按钮。

如果想快速在本地网站和远程网站之间移动文件,也可以单击某个文件并将其拖放到目标网站中即可。

1.阅后如果喜欢,不妨点赞、评论和关注一下。

2.如果喜欢玩软件,请关注本头条号阅读相关文章。

3.在学习中有什么问题,欢迎与我沟通交流,今日头条号搜索:微课传媒,我在这里等你哟!

aspx网页_微软网页设计工具Expression Web快速入门相关推荐

  1. HTML5期末大作业:甜品店网站设计——美食甜品店铺加盟企业(1页) HTML+CSS+JavaScript web期末作业设计网页_美食网页设计作业成品

    HTML5期末大作业:甜品店网站设计--美食甜品店铺加盟企业(1页) HTML+CSS+JavaScript web期末作业设计网页_美食网页设计作业成品 常见网页设计作业题材有 个人. 美食. 公司 ...

  2. Axure RP 8.0 网页与APP原型设计工具使用教程--- 项目经理、产品经理设计必备工具

    Axure RP 8.0 网页与APP原型设计工具使用教程 --- 项目经理.产品经理原型设计必备工具 Axure RP 8.0.0.3312版本下载[这个是目前能用的最新的版本,其后的版本都无法注册 ...

  3. 性能工具之 Gatling 快速入门

    文章目录 一.介绍 二. 下载 三.目录结构 四.脚本 五.快速执行 六.总结 一.介绍 Gatling 是一款基于 Scala 开发的高性能服务器性能测试工具,它主要用于对服务器进行负载等测试,并分 ...

  4. 网页设计师的最佳设计工具名单出炉

    一个网站的基本设计是为了吸引大多数人.因此,要吸引更多的客户,他们需要运用所有可能的图案和花纹,创造出惊人的效果,体现网站自身的美感.这样,设计师就需要使用一些设计工具,以确保有更高的效率.创建3D效 ...

  5. java构建网页_从网页搭建入门Java Web2018版

    步骤1: 网页搭建入门 本步骤将学习到搭建网页的所需的HTML.CSS和JavaScript等内容.并完成个人生活记录首页和轮播图效果.最终达到独立完成前端页面开发的目的. 第1课 HTML入门 本堂 ...

  6. ezdml 支付mysql 吗_数据库表设计工具EZDML使用教程

    表结构设计器(EZDML) 这是一个数据库建表的小软件,可快速的进行数据库表结构设计,建立数据模型.类似大家常用的数据库建模工具如PowerDesigner.ERWIN.ER-Studio和Ratio ...

  7. ide怎么设置方法中间加一道横线_像IDE那样使用VIM(快速入门版)

    Vim是一款文本编辑工具,她本身并无像 VSCode 或 Jetbrain系列 那样的功能,例如:代码的诊断,重构分析等IDE功能. 但这并不意味着 :Vim不能拥有IDE的功能. 如何拥有呢? 需要 ...

  8. python开发pc软件_程序员带你十天快速入门Python,玩转电脑软件开发(二)

    关注今日头条-做全栈攻城狮,学代码也要读书,爱全栈,更爱生活.提供程序员技术及生活指导干货. 如果你真想学习,请评论学过的每篇文章,记录学习的痕迹. 请把所有教程文章中所提及的代码,最少敲写三遍,达到 ...

  9. python多久能上手_小白学习Python,怎样能够快速入门上手

    原标题:小白学习Python,怎样能够快速入门上手 时至今日,Python已经成为最受欢迎的编程语言之一,清晰易读,适用广泛.在TIOBE 排行榜中位居第四,成为名副其实的人工智能第一语言. 那么零基 ...

最新文章

  1. 图片转字符 android,转字符图app下载-转字符图 安卓版v2.4-PC6安卓网
  2. border:none 与border:0的区别
  3. ajax请求接口连不上会报错吗_服务端有异常, 导致: Ajax 请求报错 net::ERR_INCOMPLETE_CHUNKED_ENCODING...
  4. JAVA day13,14 API、Object类、日期时间类(long,Date,Calendar,DateFormat)、String类(字符串,可变长字符串)、正则表达式、包装类
  5. Ubuntu搭建DNS主从服务器
  6. python3 小工具
  7. 基本MVC2模式创建新闻网站
  8. 我对Asp.net页面一系列执行过程的认识
  9. 三大框架SSM基础知识点
  10. 操作系统-信号量机制的一些习题
  11. 放大器电路的大信号带宽,压摆率是瓶颈
  12. Salesforce基础知识学习Day05
  13. 用.NET做动态域名解析
  14. 西部素质教育杂志西部素质教育杂志社西部素质教育编辑部2022年第13期目录
  15. typort快捷键+常用表情+画图
  16. 查看正在运行docker容器的启动命令
  17. 大数据分析项目实例:Hadoop数据分析应用场景
  18. 前端开发人员的精彩文字
  19. 软件压力测试图片60张,看图测压力,你抗压么?
  20. qq显示下线通知什么意思_qq下线通知是怎么回事

热门文章

  1. 重现期Matlab\Python程序(Gumbel和广义极值分布)
  2. 愚人节 之强迫症描述
  3. 有愚人节活动?微软营销长备忘录:不要惨与
  4. Java使用jacob完成office文档pdf转换
  5. 求两个数的平均值(三种方法)
  6. 20171029 勇于挑战自己
  7. 6G定位的潜力与挑战
  8. 【Linux】USB驱动程序
  9. subprocess 使用执行 cmd
  10. Aegisub挂图的两种相对路径写法