admin管理员组

文章数量:1544799

Dreamweaver CC教程:使用空白页面创建HTML布局

使用空白页面创建 HTML布局

可以创建包含预设计 CSS 布局的页面,或者先创建一个完全空白的页,然后创建自己的布局。

选择“文件”>“新建”。

在“新建文档”类别中,选择要从“文档类型”列创建的页面类型。例如,选择“HTML”可创建纯 HTML 页面。

从“文档类型”弹出菜单中选择文档类型。大多数情况下,可以使用默认选择,即HTML5。

根据要创建的页面的类型,选择其他选项。

无:如果您要创建一个简单网页而不使用任何框架,请选择此选项。

Bootstrap:Bootstrap 模板是使用 Bootstrap 框架的预定义布局。如果要使用 Bootstrap 框架创建响应式网页,请选择此选项。

注意:

如果您计划创建响应式网页,请选择 Bootstrap 框架。

如果您没有使用框架,则:

文档标题:在此字段中输入文档标题,Dreamweaver 会自动将其添加到文档的

部分。

文档类型:从“文档类型”弹出菜单中选择文档类型。大多数情况下,可以使用默认选择,即 HTML5。

从“文档类型”菜单中选择一种 XHTML 文档类型定义可使页面符合 XHTML。例如,可从菜单中选择“XHTML 1.0 Transitional”或“XHTML 1.0 Strict”,使 HTML 文档符合 XHTML 规范。XHTML(可扩展超文本标记语言)是以 XML 应用的形式重新组织的 HTML。通常,利用 XHTML,可以获得 XML 的优点,同时还能确保 Web 文档的向后和向前兼容性。

注意:

有关 XHTML 的详细信息,请访问万维网联盟 (W3C) 网站,它包含有关 XHTML 1.1 - 基于模块的 XHTML (www.w3/TR/xhtml11/) 和 XHTML 1.0 (www.w3c/TR/xhtml1/) 的规范以及针对基于 Web 的文件 (http://validator.w3/) 和本地文件 (http://validator.w3/file-upload.html) 的 XHTML 验证程序站点。

附加 CSS:将现有 CSS 布局添加到页面。为此,请单击“附加 CSS 文件”窗格旁边的“附加样式表”图标 ,并选择一个 CSS 样式表。

在不使用框架的情况下创建新的HTML页面

如果要基于 Photoshop 复合创建新页面,请选择“使用 Extract 从 Photoshop 复合中构建页面”。

选择此选项将打开 Extract 面板,您可以在其中上传 PSD 文件并开始创建 HTML 页面。

如果要使用 Bootstrap 框架创建响应式网页,则:

Bootstrap CSS:选择创建新的 Bootstrap CSS,或使用现有 CSS 文件。如果您正在使用现有 CSS 文件,请提供该文件的路径。确保 CSS 文件位于站点根文件夹中。

附加 CSS:将现有 CSS 布局添加到页面。为此,请单击“附加 CSS 文件”窗格旁边的“附加样式表”图标 ,并选择一个 CSS 样式表。

包含预构建布局:在您已有布局的情况下选择此选项。单击“自定义”可编辑网格和断点值。

使用Bootstrap框架创建新的HTML页面

如果要基于 Photoshop 复合创建新页面,请选择“使用 Extract 从 Photoshop 复合中构建页面”。

选择此选项将打开 Extract 面板,您可以在其中上传 PSD 文件并开始创建 HTML 页面。

如果希望设置文档的默认首选参数(如文档类型、编码和文件扩展名),请单击“首选参数”。

单击“创建”按钮。

保存新文档(“文件” >“保存”)。

在出现的对话框中,浏览到要用来保存文件的文件夹。

注意:

最好是将文件保存在 Dreamweaver 站点中。

在“文件名”框中,键入文件名。

请不要在文件名和文件夹名中使用空格和特殊字符,文件名也不要以数字开头。具体说来就是不要在打算放到远程服务器上的文件名中使用特殊字符(如 é、ç 或 ¥)或标点符号(如冒号、斜杠或句号);很多服务器在上传时会更改这些字符,这会导致与这些文件的链接中断。

来源:dreamweaver官网

本文标签: 站点dwhtmlCCDreamweaver