页面样式 #

页面属性 #

你可以编辑以下属性来定制你的原型的页面样式。你可以在 Style 面板中访问这些属性。

页面尺寸 #

默认情况下,页面尺寸是根据画布上的元件自动计算的,画布本身不受限制。如果需要,你可以使用 Page Dimensions 下拉菜单为你的页面设置一个静态宽度和/或高度。从一些流行的设备尺寸中选择,或者用 WebCustom Device 选项定义你自己的自定义尺寸。

提示

在移动设备上查看原型时,可以选择 Scale to Width ,使页面内容适合设备的视口。

要清除页面上的静态尺寸,请将 Page Dimensions 下拉列表设为 Auto

适应性的观点 #

如果你为多个视口尺寸进行设计,点击 Add Adaptive Views ,为每个目标视口设置一套单独的页面尺寸。你可以为每个视口尺寸调整你的内容的大小和位置,浏览器会自动为目标设备的视口显示适当的视图。

请查看 自适应视图 (opens new window) 文章以了解更多。

页面对齐 #

Align LeftAlign Center 之间进行选择,以确定页面内容是对准浏览器窗口的左边缘还是对准中心。

注意

页面对齐不影响 Axure RP 画布上元件的对齐。

填充 #

  • Color: 设置页面的背景颜色和不透明度。

  • Image: 设置页面的填充图像以及图像的对齐方式和封面类型。

注意

颜色和图像填充在 Axure RP 和浏览器中都可以被看到。

低保真模式 #

低保真模式降低了你的页面的视觉保真度,以帮助你的老板关注设计的用户体验,而不是其视觉效果。

当 Low Fidelity 模式激活时,页面被转换为灰度显示效果,同时所有字体都被替换为手写字体,让界面看起来更加粗糙。

页面样式 #

页面样式是可重复使用的、集中管理的样式属性集。你可以将一个单一的页面样式应用于多个页面,以统一它们的样式。如果你改变了页面样式中的一个属性选择,这个改变将被应用到所有使用该样式的页面。

要将一个页面样式应用到一个页面,点击画布,然后在 Style 面板的页面样式下拉菜单中选择页面样式。

你可以通过点击 Style 面板中页面样式下拉菜单旁边的 Manage Page Styles 图标来查看和管理原型中的页面样式。

页面样式层次结构 #

每个页面的视觉外观都是由以下位置的样式属性选择决定的,按从高到低的顺序排列。

  1. Style 面板中对页面本身进行的样式属性选择,这些选择覆盖了 Default 样式和页面自己应用的页面样式中的选择。

提示

所有的页面一开始都是默认样式。如果你需要快速地对你的原型中的所有页面做一个样式的改变,并且你还没有使用任何其他的页面样式,请更新默认样式。

  1. 页面应用的页面样式,其样式属性选择覆盖了 Default 样式中的选择。

  2. Page Style Manager 对话框顶部的 Default 样式,其样式属性选择将应用于原型中的每个页面。

注意

当一个页面的样式属性选择与它所应用的页面样式不同时,在 Style 面板中,该样式的名称后面会有一个星号。

更新和创建样式 #

快速更新 #

要快速更新一个样式,编辑当前使用该样式的页面的样式。然后在 Style 面板中,点击样式名称右边的 Save changes back to style 图标来更新它。更新将适用于项目中目前使用该样式的所有页面。它也将适用于任何未来使用该页面样式的页面。

快速创建 #

要快速创建一个新的样式,编辑任何页面的样式。然后在 Style 面板中,点击页面当前应用的页面样式右侧的 Manage Page Styles 图标。Page Style Manager 对话框将打开,然后你可以创建一个新的样式。然后你可以点击 Copy Page style properties ,用你添加到当前页面的编辑来更新新的样式。

页面样式管理器 #

点击 Manage Page Styles 图标,在 Style 面板的页面样式下拉菜单旁边,打开 Page Style Manager

要添加一个新的样式,请在对话框的顶部点击 Add 。或者,你可以点击 Duplicate ,从一个现有的样式制作一个新的样式。

要删除一个样式,选择它并点击 Delete 。使用 UpDown 箭头来重新组织对话框中的样式。

要编辑一个页面样式的属性,在左栏中选择它。在右栏中,选中一个样式属性旁边的方框,让该属性覆盖默认样式,然后在适用的字段中为该属性做出选择。

你也可以一次编辑多个样式。按住 CTRL 或 CMD,同时在左栏中选择样式,然后在右栏中进行修改。