用户样式

用户样式是常规的 CSS 样式，列在 Sitecake 工具栏下拉菜单中，供编辑者选择和应用。

当设计师设计网站时，他会为文本、图片、列表和其他所有元素定义一组美观一致的视觉样式。有时设计一组替代样式非常有用，网站编辑（客户）可以在需要时应用这些样式。我们将这种样式称为用户样式。

要创建用户样式，需要在外部样式表中定义特定的 CSS 规则。外部样式表可以是通过 <link> 引用的外部 CSS 文件，也可以是通过 <style> 定义的内联样式。

理论到此为止，下面给出一些示例：

示例

如果您有如下基本的 HTML 页面结构：

以下将是有效的用户样式：

示例 1

.sidebar p.red { background-color: red; }
.sidebar p.blue { background-color: blue; }

定义了 sidebar 容器中 p 标签的两种变体（蓝色和红色）。

示例 2

.sidebar ul.red-dot {
padding: 5px;
}

.sidebar ul.red-dot li {
background: url(../images/red-dot.png);
}

.sidebar ul.blue-dot li {
background: url(../images/blue-dot.png);
}

定义了 sidebar 容器中 ul 标签的两种样式（red-dot 和 blue-dot）。

示例 3

.sidebar p.red, .main p.red {
...
}

定义了 sidebar 和 main 两个容器中段落的 red 用户样式。

示例 4

#main-column > div.sc-html.outlined {
outline: solid 1px red;
}

定义了 main 容器（通过 ID 选择）中自定义 HTML 元素的 outlined 样式变体。

什么不会生效

声明中没有父元素的样式：

p.red { color:red; }

如果不指定父元素，Sitecake 不知道该为哪个容器提供此替代样式。