元素样式设置

PageFly为所有元素提供了强大的样式选项。 为了说明它们是如何工作的,我们来看两个案例:图片和段落元素。

样式参数Click to copy

整体Click to copy

内容颜色Click to copy

您可通过此参数选择内容文本或图标的颜色。

PageFly Element style settings

注意:

  • 有些元素并没有该参数,如 “图片” 。

间距Click to copy

您可使用该组中的参数控制元素周围和内部的间距。 在“填充”和“边距”参数中,每个都有4个空框,可让您填写4个值:顶部-右侧-底部-左侧。

您可以在“编辑间距”文章中阅读有关此内容的详细信息。

排版印刷Click to copy

您可在此修改字体。

PageFly Element style settings 1

您可以通过打开字体管理器来添加更多字体。

Element style settings 2

对于每种字体,您可以配置以下参数:

  • 字体大小
  • 文字对齐
  • 文字样式

Element style settings 4

更多设置”按钮为您提供4个其他选项:

  • 字体粗细
  • 线高
  • 字体间距
  • 文字转换

Element style settings 5

背景Click to copy

该组的参数使您可以配置元素的背景颜色和图像。

选择背景图像后,“更多设置”按钮将为您提供另外4种配置背景图片的方式:

边框Click to copy

您可通过边框样式和边框颜色来设置元素的边框样式。

您可以在下面看到带有实心边框样式和红色边框的插图

pagefly styling tab 7

“更多设置”按钮有2个其他选项可调整“边框宽度”和“边框半径”。 在下面的示例中,所有边的“边框宽度”均设置为10像素,而“边框半径”均设置为40像素。

pagefly styling tab 8

显示Click to copy

通过CSS显示选项管理元素排列:

  • 排队
  • 组块
  • 柔性

阅读更多:

自定义CSSClick to copy

元素的所有设置将按照下图显示在自定义CSS参数中。

pagefly styling tab 9

您可编辑CSS代码,所有更改都将应用到页面编辑器中。

样式预设Click to copy

PageFly提供了预制的样式预设,可让您快速配置样式。

pagefly styling tab 10

当前,此功能仅适用于某些元素,但是在不久的将来,我们将更新让所有元素都有样式预设。

设备特定设置Click to copy

.所有元素样式设置可一次性配置所有设备,也可以为笔记本电脑,平板电脑或手机等单个设备专门配置。 要编辑特定设备的样式,只需使用设备切换器将编辑模式切换到目标设备并调整其样式设置即可。

pagefly styling tab 11

注意

在“所有设备”中配置的参数将自动适配所有设备。 仅在极少数情况下,您才需要为特定设备进行配置。

Navigate this category

Next articlePrevious

Feedback
Thank you for your feedback!

Could not find the answer
to your question?

Chat with us
PageFly Languagues

PageFly Help Center is now available in Chinese, French and Japanese. Please check the flags on the page header.

I got it!
Discover the Shopify Invoice Generator by PageFly, a seamless solution for invoicing in your online store. Try it now!