作为一个13+定位的网站，警告和警告栏的使用非常重要，而这些警告的作用就是提示对方这部分内容需要注意什么，尤其是警告栏，我们将会说明这部分的内容。

警告栏的代码（仅限于此）

警告栏的代码如下：

<div class="custom-alert alert-red"></div>
<div class="custom-alert alert-orange"></div>
<div class="custom-alert alert-blue"></div>
<div class="custom-alert alert-purple"></div>
<div class="custom-alert alert-black"></div>
<div class="custom-alert alert-green"></div>

效果如下：

警告和警告栏的用处和使用

你只要知道最基础的一点：特定的警告就用文字高亮，普遍的警告就用警告栏。

警告

对于特定文章的部分内容，我们会直接用文字加粗+高亮来表现，例如在集大成者的雨宫中我们也用了这样的表示方法。

这样的警告一般只用蓝色和红色两种颜色，蓝色更像是普通的内容提示，而红色会更倾向于比较严肃的警告。

红色警告栏（现实敏感内容警告）

红色警告栏的出现意味着接下来的内容会和现实中敏感的事件与话题，一般是涉及政治和历史的内容，也是最严重的警告栏。

在实际的活动中，红色警告栏也有橙色警告栏的作用，至少我们认为红色警告栏的内容也一样被视为成人内容的一种，换句话说，严肃的政史内容也一样不适合未成年人。

橙色警告栏（成人内容警告）

橙色警告栏用于“成人内容”，或者说，文章的内容不适合未成年人。

你可以在网站里找到明坂市在这方面的一部分内容，例如“鸟羽-织田分级”和“樋口事件”，从这里我们可以理解橙色警告栏的适用范围。

就现在而言，“成人内容”除了红色警告栏的严肃政史内容，主要是惊悚、情色、血腥三种内容，但是如果你是为了看这些内容而来，那么很抱歉，这里并不会有你想要看的，但是我们依然要加入警告，避免被一些人误以为是不正规的违法网站。

蓝色警告栏（故事敏感内容警告）

蓝色警告栏是用来提醒接下来的内容在明坂市的世界里属于敏感的内容，相当于弱化版的红色警告栏。

一般来说出现红色警告栏就一定会出现蓝色警告栏，但是蓝色警告栏出现并不等于红色警告栏会出现。

在目前的明坂市里，敏感内容主要涉及：建校七人与四十元老以及2003~2007年的历史、旧天文社、三大冲击（如月变制、月虹党争、2021年社会科教材争议）。

紫色警告栏（厌恶警告）

紫色警告栏比较特殊，用于提醒接下来出现的人或事物会让人感到厌恶甚至不适。

就像故事里一定会出现正派和反派引发矛盾一样，明坂市也一样有着一些不受欢迎的学生，例如雨宫、相泽、可爱川等等，同样一些怪谈造物也一样，例如镜怪。

虽然如此，这并不意味着她们一定惹人讨厌，但是一定代表着她们做过不受欢迎的事情。

黑色警告栏（死亡警告）

黑色警告栏用来表示介绍的角色已经幽灵化（死亡）。

绿色警告栏（更新警告）

绿色警告栏用于有时效性且需要一直更新的内容。

警告栏的技术部分

警告栏本身会根据你的需要而有着不同的设计，但是警告栏一般分为两个部分，分别是HTML部分和CSS部分，前者就是你看到的代码，而后者就是警告栏的样式，我们主要讨论后者的思路。

警告栏整体分为三个部分，分别是背景框架、图标、文本。

背景框架的作用在于区分与分类，也就是将警告栏与文章和页面的其他内容区分看来，并且确定不同的警告栏。

图标和文本是警告栏的核心，我们建议以文本为核心，图标次之，一定程度上你的背景框架就已经承担了图标的作用，而文本将会承担你的警告内容部分，也就是警告的内容。

关于图标，可以选择常见的表情符号或者通过CSS代码绘制解决。