你好！我是wackdog。这是我可能即将推出的系列基础指南的第一篇，教你如何根据自身需求修改版式，小到单个页面上的应用、大到完整的版式创建。

本系列指南将完全聚焦于快速实现特定修改。如果你想要学习更多有关CSS的一般知识，请查看fish-s-absolute-beginner-s-guide-to-css。

这篇指南将讲解 Logo 和 页眉标题（header titles） 的修改。

这些修改的具体实现方法会因基础版式1Footnote 1.“基础版式”指一套核心CSS布局与样式框架，它们决定了基础结构和视觉效果；举例而言，Sigma和黑标。可以基于一个基础版式搭建或扩展出其它版式或是文章的专属样式。不同而异，每个基础版式都将在它们各自的章节中讲到。

第一步是弄清楚你正在使用什么基础版式，或者如果你使用的已经是自定义版式了，那就要弄清楚它是基于什么基础版式搭建的。以下是一些简单的判断方法：

版式页上通常会直接告诉你这是一个Sigma版式。例如：

这是一个由wackdog制作的Sigma版式

这是一个由wackdog制作的Sigma+版式

如果没有相关说明，或者它不要求include黑色标记笔（Black Highlighter）或玄武岩（Basalt），那它很可能就是Sigma。

黑色标记笔的版式页上会有它标志性的Logo，也会有一段黑标的include代码：

玄武岩的版式页上会有它标志性的Logo，也会有一段include代码：

在Sigma的CSS中，Logo是页眉的背景图像，可以通过如下方法进行更改：

[[module CSS]]
#header {
    background-image: url(https://图片链接.png);
}
[[/module]]

将“@@https://图片链接.png@@”替换为你图片的URL，这一URL应为你将图片上传到SCP维基页面后获得的链接。

标题1：“SCP基金会”
此标题对应的代码及其修改方式如下：

[[module CSS]]
#header h1 a span {
  line-height: 0px;
  max-height: 0px;
  color: transparent;
  text-shadow: none;
}
#header h1 a::before {
  content: "你的基金会";
}
[[/module]]

标题2：“控制，收容，保护”
此标题对应的代码及其修改方式如下：

[[module CSS]]
#header h2 span {
  line-height: 0px;
  max-height: 0px;
  color: transparent;
  text-shadow: none;
}
#header h2 span::before {
  content: "你的，其它，标语";
  color: #f0f0c0;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, .8);
}
[[/module]]

用于改变Logo的变量是：

[[module CSS]]
:root:lang(cn) {
  --logo-image: url("https://图片链接.png");
[[/module]]

用于改变页眉的变量是：

[[module CSS]]
:root:lang(cn) {
  --header-title: "你的基金会";
  --header-subtitle: "你的，其它，标语";
[[/module]]

[[module CSS]]
:root {
  --logo: url("https://图片链接.png");
[[/module]]

[[module CSS]]
:root {
  --title: "你的基金会";
  --subtitle: "你的 - 其它 - 标语";
[[/module]]

• 你不需要为每个修改都创建一个新的CSS模块（module CSS）。它们可以共用一个CSS模块。
• 请确保你的CSS模块位于你的版式include代码之后。
• 尽量不要让你的页眉标题们过长，因为可能会引发移动设备的换行问题。如需帮助设置以避免移动设备产生问题，你可以联系SCP官方Discord2Footnote 2.译注：该链接通往英文站Discord，该“官方”也仅限于英文站范围内。中#writing-technical频道的成员。

下次见！下次我们将讲解版式颜色的修改以及调色盘！