创建 HTML 编辑器样式

重要:  本文是由机器翻译的,请参阅免责声明。请在 此处 中查找本文的英文版本以便参考。

与Microsoft Office SharePoint Server 2007发布网站内容的所有者可以创建和使用 Web 浏览器中更新的网站中的网页。例如,部门经理可以使用浏览器发布公告和其他信息类似的显示下图中直接向他们的网站。

浏览器中的发布网页

开发人员或网站的设计,可以帮助的内容创建者使他们创建的页面外观更好地创建样式,可以应用于从页面布局创建的页面的部分。创建自定义样式还有助于标准化此类页面的外观。本文介绍如何 Web 开发人员或设计器可用于Microsoft Office SharePoint Designer 2007创建可应用于发布页面的创建或编辑在浏览器中的自定义样式。

重要: 本文仅适用于位于运行Office SharePoint Server 2007的服务器的网站。此外,发布必须启用网站集的顶级网站中。此外,您必须具有创作才能打开和编辑页面布局的顶级网站的权限。

本文内容

如何在发布网站中使用 HTML 编辑器?

创建 HTML 编辑器样式

如何在发布网站中使用 HTML 编辑器?

创建发布页面的自定义样式,需要了解的一些关键概念Office SharePoint Server 2007中。下面是快速审阅。

发布页面与页面布局?

控制页面的外观,哪些页面字段和内容的域的页面模板可用,而准确的元素 (如列表和库) 应出现在页面上,是页面布局。例如,您可以设置行程报告的一个页面布局、 新闻稿的文章,另一个页面布局和计划更新的第三个页面布局。授权的用户可以创建基于这些页面布局的新发布网页。他们创建的每个页面遵循特定类型的内容,它将包含一致的格式。用户可以在其浏览器中,在其具有创建网页每次选择的页面布局的选项来创建发布页面。

显示发布网页布局列表的对话框

可以在Office SharePoint Designer 2007编辑页面布局。有关详细信息,请参阅文章自定义发布网页布局

页面布局位置获取其格式?

页面布局获取其格式的页面模板的定义 (如页眉、 页脚和左侧的导航) 共享内容的区域,以及使用样式表来控制格式的文本、 超链接、 单元格、 表格和许多其他元素的母版页。页面布局还可以直接向他们应用的样式表从其格式。例如,页面布局可能会收到其初始格式规则从母版页,但您始终可以将其他样式表附加到要更精确地定义从其创建的页面的格式设置的页面布局。例如,宋体字体中,是正常的所有文本,但您可以将样式表附加到指定所有附加的网页,对于常规文本字体使用 Arial 的页面布局,可以指定基于页面布局的母版页。所有格式和发布页面上的标记,除内容字段 — 直接来自创建它的页面布局。

在发布页面如何编辑内容?

当您创建发布页面时,您可以在浏览器中创建它。创建页面后,您可以通过浏览,单击网站操作菜单上,然后单击编辑页面来进行编辑。

显示“编辑网页”命令的“网站操作”菜单

打开页面后,您可以单击编辑内容以打开要编辑任何格式文本字段的 HTML 编辑器。

打开的网页上的“编辑内容”命令

注意: 不包含格式文本字段具有其自己编辑器 — 例如,日期字段具有其自己编辑器。

HTML 编辑器将打开,以便您可以添加或编辑内容、 手动更改字体和格式,或选择多个其他选项。将样式应用于文本,您选择的文本,单击样式,然后单击您想要应用的样式。

显示“样式”列表的 HTML 编辑器

HTML 编辑器是从哪里获得其样式的?

HTML 编辑器中可用的样式将来自两个位于您的网站或子网站的 _layouts 目录的样式表︰

  • HtmlEditorCustomStyles.css 定义自定义样式的格式,并位于︰

    http://your_site/_layouts/1033/styles/HtmlEditorCustomStyles.css

  • HtmlEditorTableFormats.css 定义表的格式,并位于︰

    http://your_site/_layouts/1033/styles/HtmlEditorTableFormats.css

因为这些样式表都位于您的网站中受保护的 _layouts 目录中,不能在Office SharePoint Designer 2007修改它们。但是,您可以通过将其他样式应用于您用于创建发布页面的页面布局覆盖这些样式表中的样式。

返回页首

创建 HTML 编辑器样式

您可以通过在Office SharePoint Designer 2007中打开该网站,然后使用以下过程创建新样式的 HTML 编辑器中。

找到并打开的页面布局

如果您已经创建的页面布局,并且现在想要创建新的样式,以便它们是可供使用 HTML 编辑器中浏览器中,您首先查找并打开的页面布局。您可以通过双击本身的页面布局或已从该页面布局创建任何发布页面中打开的页面布局。

  1. 在Office SharePoint Designer 2007,打开包含要修改的页面布局的网站。

  2. 文件夹列表中,找到使用您要对其应用新样式,页面布局的页面,然后双击页面。

    注意: 发布页面存储在网站中的页面文档库。双击发布页面是一种快速方法,查找并打开发布页面附加到的页面布局。如果您已经知道您要为其创建新样式的页面布局的名称,您可以双击,而不是页面的页面布局。

    出现关于编辑网页或基础网页布局消息时的文件夹列表

    可以仅在浏览器中编辑发布页面,因为一条消息询问您是否要编辑在浏览器中的页面或编辑基础的页面布局。

  3. 单击编辑页面布局

    此时将打开页面布局。

覆盖现有样式

如果您想要覆盖现有样式,可以将现有样式从 HtmlEditorCustomStyles.css 或 HtmlEditorTableFormats.css 复制到另一页使用的样式表,然后修改样式。首先应用 _layouts 目录中的样式表,因为上所使用的页面布局的任何其他样式表的样式将覆盖从 HtmlEditorCustomStyles.css 或 HtmlEditorTableFormats.css 样式。

  1. 在 Web 浏览器中,转到要从中复制通过在浏览器地址栏中键入以下位置之一的一个或多个样式的样式表的位置︰

    http://your_site/_layouts/1033/styles/HtmlEditorCustomStyles.css

    -或者-

    http://your_site/_layouts/1033/styles/HtmlEditorTableFormats.css

  2. 当您收到一条消息询问您想要如何处理文件时,单击打开

    在Office SharePoint Designer 2007中打开样式表。

  3. 选择您要修改的文件,右键单击它,然后单击快捷菜单上的复制的样式。

    显示快捷菜单和“复制”命令时的样式表

  4. 仍然在Office SharePoint Designer 2007,打开 (或返回到) 要为其覆盖样式,然后单击管理样式任务窗格中的选项页面布局。

    注意: 如果未显示管理样式任务窗格,在任务窗格菜单上单击管理样式

  5. 请确保已选中显示当前页中使用的样式

    选定“显示当前页面中使用的样式”命令时的选项菜单

  6. 管理样式任务窗格中,双击某个在此页面中,如 pageLayout.css,用于将其打开进行编辑样式表。

    每个样式表应用于当前页显示为节标题CSS 样式列表中,在管理样式任务窗格。您可以双击要编辑该样式表的任何样式表的标题。

  7. 滚动到底部的样式表,右键单击您要在其中粘贴该样式,,然后单击快捷菜单上的粘贴

  8. 但是所需的编辑样式。

    注意: CSS 属性任务窗格提供了编辑样式的可视化效果更佳方法。如果此任务窗格中不可见,在任务窗格菜单上,单击CSS 属性

  9. 若要保存样式表中,在文件菜单上,单击保存

下次您使用 HTML 编辑器编辑此网页布局,创建一篇文章修改的样式可供使用,并显示在样式列表。

显示修改后样式的“样式”列表

创建新样式

您也可以创建新样式,并使其可在样式列表中 HTML 编辑器中。因为它是更轻松地从现有样式大于其键入新样式,本部分介绍如何执行此操作通过复制现有样式和重命名它。

  1. 在 Web 浏览器中,转到要从中复制样式,通过浏览器地址栏中键入以下位置之一样式表的位置︰

    http://your_site/_layouts/1033/styles/HtmlEditorCustomStyles.css

    -或者-

    http://your_site/_layouts/1033/styles/HtmlEditorTableFormats.css

  2. 当您收到一条消息询问您想要如何处理文件时,单击打开。在Office SharePoint Designer 2007中打开样式表。

  3. 选择您要修改的文件,右键单击它,然后单击快捷菜单上的复制的样式。

    显示快捷菜单和“复制”命令时的样式表

  4. 仍然在Office SharePoint Designer 2007,打开 (或返回到) 要向其添加新样式,然后单击管理样式任务窗格中的选项页面布局。

    注意: 如果未显示管理样式任务窗格中,单击任务窗格,然后单击管理样式

  5. 请确保已选中显示当前页中使用的样式

    选定“显示当前页面中使用的样式”命令时的选项菜单

  6. 管理样式任务窗格中,双击某个在此页面中,如 pageLayout.css,用于将其打开进行编辑样式表。

    每个样式表应用于当前页显示为节标题中的Css.styles列表中管理样式任务窗格。您可以双击要编辑该样式表的任何样式表的标题。

  7. 滚动到底部的样式表,右键单击您要在其中粘贴该样式,,然后单击快捷菜单上的粘贴

  8. 但是所需的编辑样式。

    如果不想重写您复制的现有样式,您必须更改的样式的名称。例如,如果您想要指定 redHeadline 您新样式,更改以下 CSS 代码。

.ms-rteCustom-ArticleTitle, .ArticleTitle{font-weight: bold;font-family: Arial;font-size: 14pt;color: #8C0000;text-transform: capitalize;}

更改为︰

.ms-rteCustom-redHeadline, .redHeadline{font-weight: bold;font-family: Arial;font-size: 14pt;color: #8C0000;text-transform: capitalize;}

注意: CSS 属性任务窗格提供了编辑样式的可视化效果更佳方法。如果此任务窗格中不可见,在任务窗格菜单上,单击CSS 属性

  1. 若要保存样式表中,在文件菜单上,单击保存

    下次您使用 HTML 编辑器编辑此网页布局,创建一篇文章修改的样式可供使用,并显示在样式列表。

    显示修改后样式的“样式”列表

返回页首

注意: 机器翻译免责声明:本文是由无人工介入的计算机系统翻译的。Microsoft 提供机器翻译是为了帮助非英语国家/地区用户方便阅读有关 Microsoft 产品、服务和技术的内容。由于机器翻译的原因,本文可能包含词汇、语法或文法方面的错误。

扩展你的技能
了解培训
抢先获得新功能
加入 Office 预览体验计划

此信息是否有帮助?

谢谢您的反馈!

谢谢你的反馈! 可能需要转接到 Office 支持专员。

×