如果您是程序员、自由职业者、开发人员或代理机构，希望自定义 GemPages 设计中特定元素的样式，那么添加额外的 CSS 类是一种有效的解决方案。
关于 CSS 类
一个CSS （层叠样式表）类 是在您的网站样式表中定义的规则，允许您将样式应用于元素。
通过为元素分配 CSS 类，您可以 控制其外观，例如其大小、颜色、间距和其他视觉属性。
如果您需要 高级定制 除了 GemPages 中的默认设置之外，您还可以根据自己的喜好编写自己的 CSS 代码来设置元素样式。
使用 GemPages 时自定义 CSS 的最佳实践和局限性
添加自定义 CSS 可以让你拥有更大的样式自由度，但建议明确界定类的作用域，以避免主题冲突和意外覆盖。
- 除非必要，否则避免全局应用 CSS 规则。
- 使用类级定位，而不是定位 ID 或通用标签。
- 不要重复使用 GemPages 内置控件已经提供的样式。
- 发布前请测试手机和平板电脑的布局。
- 保持 CSS 模块化和可重用性（例如，使用实用风格的类命名）。
这样可以确保您的自定义代码保持可维护性，并且在更新主题、版本或布局时不会出错。
如何向元素添加自定义 CSS 类？
与直接在 Shopify 主题自定义中添加 CSS 不同，在 GemPages 中添加自定义类可以设置特定区块或组件的样式，而不会影响整个商店。
按照以下步骤向 GemPages 元素添加自定义 CSS 类。
第三步： 点击要自定义的元素。这将在左侧边栏中打开该元素的设置。
第三步： 在左侧栏的设置菜单中，找到并点击 高级选项卡.
向下滚动以找到 CSS类 部分.
第三步： 在 CSS类 部分，输入 CSS类 你想添加。
计费示例：
如果你的 CSS 包括：
.red-text { color: red; }
.bold-text { font-weight: bold; }
进入 红色文本 粗体文本 在 CSS 类字段中将对元素应用红色和粗体文本。
如需更多自定义选项，请探索 本文.
关于 CSS 类的常见问题
1. 我能否将 GemPages 中的自定义 CSS 应用到整个网站？
不，在 GemPages 中应用的 CSS 只会影响 GemPages 页面渲染的元素。如果您需要在整个商店中使用全局 CSS，请在 Shopify 主题级别添加 CSS。
2. 自定义 CSS 会影响性能吗？
过多的自定义 CSS 或加载大量字体会影响性能。尽量使用最少的规则并重用类，以避免不必要的文件大小。
3. 我可以将 GemPages 自定义 CSS 与主题级自定义 CSS 结合使用吗？
是的，但要避免选择器重叠以防止冲突。尽可能将 GemPages 类的作用域限定在组件/页面内。
谢谢您的意见