
上QQ阅读APP看书,第一时间看更新
1.3 实战演练:新建网页

视频讲解
网页是纯文本文件,通过各种标记来标识文字、图片、表格、表单、视频、声音等网页对象,浏览器根据这些标记把网页对象渲染成页面效果再显示出来,通常是HTML格式,扩展名多为.html、.htm。
【操作步骤】
第1步,启动Dreamweaver CC,选择【文件】|【新建】命令,打开【新建文档】对话框,如图1.14所示。

图1.14 【新建文档】对话框
第2步,【新建文档】对话框由【空白页】、【流体网格布局】、【启动器模板】和【网站模板】共4个分类选项卡组成(模板是依照已有的文档结构新建一个文档)。
第3步,在左侧选项卡中选择一种类型,如【启动器模板】,然后在【示例文件夹】列表框中选择子类项,如【Mobile起始页】选项,则右侧列表框将显示【示例页】类别的所有选项,如图1.15所示。

图1.15 新建启动器模板
第4步,在示例页列表框中选择一种类型的页面,在右侧的预览区域和描述区域中可以观看效果,以及查看该页面的描述文字。
例如,选择【jQuery Mobile(本地)】选项,对话框的预览区域自动生成预览图,描述区域自动显示该主题的描述说明。
如果在分类选项卡中选择【流体网格布局】分类选项,则可以在右侧设置流体网格布局配置参数,如图1.16所示。

图1.16 新建流体网格布局
第5步,单击【新建文档】对话框中的【创建】按钮,Dreamweaver CC会自动在当前窗口创建一个移动互联网网页,如图1.17所示。

图1.17 新建的jQuery Mobile移动页面模板
可以根据上面介绍的方法创建不同类型的页面或者创建一个空白页,具体步骤就不再重复了。