奥多制药-农科 版式

基于基岩版式。另见：玄武岩、本征机器、特征向量。

评分: +16+–x

欢迎来到奥多制药-农科主页的版式！我们旨在解决你们的饥饿问题。


要在你的页面中使用此版式，请在页面的任意位置写入以下语句：

[[include :scp-wiki-cn:theme:bedrock]]
[[include :scp-wiki-cn:theme:ordopharm]]

要启用内网模式，需写入以下参数：

[[include :scp-wiki-cn:theme:ordopharm intranet=a]] 在此查看实际效果！

要启用复古模式，需写入以下参数：

[[include :scp-wiki-cn:theme:ordopharm legacy=a]] 在此查看实际效果！

基本样式

各级标题

查看各级标题

分页卡

一般的选项卡如下所示：

乱数假文 lorem ipsum



不过，你也可以添加颜色类来改变分页卡的外观，或是使用一些独特的修饰类（参见分页修饰类）。

乱数假文 lorem ipsum


将 tabview 包裹在 mapview 中，即可获得交互式节点地图，它支持最多 12 个可通过坐标系定位的“分页卡”（参见根变量），并可使用上述修饰类进行自定义。

点击节点后，相关文本便会显示。

引用块

这是一个引用块。

更多文本

上方是一条水平分隔线。

嵌套引用块

继续嵌套。


写入着色类可改变颜色：

blockquote hazard

表格

地区 签约公顷数 产量指数
北美洲 41,200,000 118
南美洲 38,700,000 124
欧洲、中东及非洲 22,900,000 1091

脚注

自定义 Div 与 Span

首屏核心区（Heros）

首屏核心区 hero 类似于吸引眼球的标题块，或者醒目的横幅。

作物科学
供养一个需求永无止境的世界。
到 2050 年，地球将承载一百亿人口，而可耕作土地面积仍与今日相同。面对这道数字难题，我们的种子与作物保护产品组合应运而生——也是为了每个季节都不得不反复求解的农业者。

否则，后果自负。

代码

种子系统
一粒种子。九十年的精密计算。

阅读我们的完整报告。

代码

横幅

横幅 band 使用封闭方块容纳一小块文本，或使用彩色分割线（rule）另起一段文本。

我们的承诺
band mist

band rule azure

band teal bleed

面板组

面板组 panes 是一个响应式子元素容器网格；每个 pane 子元素都可以使用自己的颜色类和尺寸，并保持等距排列。为网格添加 duo 或 quad 可改变列密度，为面板添加 filled 则可反转其配色。

作物科学

业务遍及四十一个地区，涵盖种子遗传、作物保护与数字农业。

消费者健康

非处方治疗产品、营养品，以及你早已拥有的零售品牌。

制药

最初的业务。如今仍在为其他一切买单。

单栏面板。

投资者关系

pane filled navy，反色以突出重点。

可持续发展

pane wheat，带有彩色顶边的标准样式。

一

panes quad

二

在宽屏上可并排排列四块。

三

乱数假文 lorem ipsum

四

乱数假文 lorem ipsum


醒目引语块

pullquote 是一种短而抓眼的引语块；它使用独立的块以进行强调。

我们出售安心，并按公顷计价。
首席执行官，年度报告


行情条

行情条 ticker 是一种采用等宽字体、带有投资者关系风格的信息条。将各条目包裹在 up、down 或 flat 类中即可显示对应箭头。

ORDO 214.55 +1.24%
种子期货 88.10 -0.42%
成交量 4.1M

代码

为行情条 ticker 添加 scroll 类来实现滚动显示。其速度由 --ticker-speed 控制，单位为秒。

ORDO 214.55 +1.24%
种子期货 88.10 -0.42%
成交量 4.1M
作物科学 41.02 +0.88%


分栏与侧边框

split 是一个双栏网格，在窄屏上它会叠放为单栏。使用 weighted 类来使首栏更宽。

左栏

两栏等宽。两个子元素都是普通 div 块，可以在内部放置任何东西。

右栏

宽度小于 17rem 时，会折为单栏。

split weighted 使本栏变为 1.6fr，而侧边栏为 1fr。这跟 pane 搭配起来恰到好处。

侧边栏

与 pane 搭配得恰到好处。

sidebox 是一个浮动面板，默认处于屏幕右侧。文本会将其包裹，除非另有指定。

概览

成立年份 1912
总部 未公开
员工 109,000
科室 32

数角究治以并两家，利车热如工值，铁马否品新。流自青极张消步率低据指治历十，头者号个程活蠢史省专程。低象维天史便人周，细县全前也利术，委雨作折岗。积即又众根前百，置场色没走，感不利私。想满商能位格因转京议二指，下速七等号称科打量位，毛设状杠越回对构精。动山心去满省队后，动支相火解工得，元单更理造作，罐心属强。结九改理干山信那，听且任养见期，才主江权。多果引受美情却山经己区会历身适，自车任求住近定极治租老斗。

耕地备忘

场地 C-14
播种时间 四月
状态 已隔离

为 sidebox 添加 left 类使其在左侧悬浮。除车研同直北传动，没引她育过社，高弦火住技位。万亲把权适农但社金，上元究料于总育先，天织照百只。置个步时参形深形花置适，千是整给这结育几与原，性入物看火呀覆专。十队基中都团究全增，山须决反则权由线取，家豆响山何歼选。设记就查人龙所克新群证习素，只龙基信电越弦阶毛起想边。

数字组（Metrics）

数字组 metrics 是一组标题数字组成的响应式网格，在此类网页中十分常见。每个子元素都需要一个数字 figrue、一个标签 label，以及自己的着色类。--stat-min 用于设定触发重排的最小宽度。

使用 counter-element 来实现从一个数字跳动到另一个数字。

尝试一下

2
本行中数字的数目。

1
本片段中出现的数字的数目。

2 / 4
本片段中已经出现过的数字的数目。

3
序列中的数字值。

第 4
本序列的最后一个数字。

流程图（Pipeline）

流程图 pipeline 对项目周期内的各个阶段进行标号，自动进行。可将任意阶段标记为 done（已完成）、now（进行中）或 halted（已中止）。--stat-min 用于设定触发重排的最小宽度。

温室筛选

已收容耕地测试

申报监管资料

开放环境释放

商业化运营

时间线（Updates）

updates 是一种纵向时间线。每个子元素都需要一个 date（日期）及其着色类；记号、日期会被着色。

三月 12
最近的阶段。

三月 04
之前的阶段。

二月 27
最久之前的阶段。

资料表

factsheet 集中展示一系列彼此相关的细节。

注册名称 奥多制药农科公司 N.V.
股票代码 ORDO
业务板块 作物科学、消费者健康、制药
异常资产 奉命删去

磁贴组

磁贴组 tiles 是一组导航卡组成的网格，每张卡片右下角都有一枚箭头。--tile-min 用于设定触发重排的最小宽度。

投资者关系

季度业绩、备案文件及年度报告。

作物科学

育种、作物保护、数字农业。

制药

药物开发流程、授权咨询。

巨幅横幅（Jumbotron）

Jumbotron 是一种“全宽”图像横幅，用作页面顶部“引人注目”的视觉印象，其他元素可以叠放在其上，充当标题区域之类的东西。大概吧。该组件复刻自拜耳–孟山都网站中的真实页面元素

查看尺寸选项

通知与旗标

通知

通知 notice 是带有背景色的提示框，使用 --notice-word 来更改横幅文本。

产品供应情况因地区而异。请查阅您当地的注册信息。

请勿在静水体 3 公里范围内施用。

您会死。

徽章

徽章 badge 是一种行内贴片。使用 hollow 类来添加外边框。

状态：已结案 审查中 已撤回 已归档

胶条

胶条 tape 是一条警告色条纹分割线。使用 thick 类来使其高度增加一倍。

进度条

收起以测试
代码

加载条

第四季度收益预览

产品标签

ORDOSAN-9

选择性苗后除草剂。

product_label amber medium

文档

备忘录

memo

compliance_memo

legal_memo

custom_memo teal

memo stamped

着色类

精心调配了以下色彩组合以求最佳视觉享受。

查看着色选项

字体排印工具

eyebrow 位于大标题上方的引题小字，西文部分为大写
headline 字距紧凑的大号展示文字；添加 heavy 可加粗
lede 字号略大的介绍段落
attrib pullquote（醒目引语块）下方的署名行
smallprint 使用等宽字体的法律细则小字
s-title 小节标签，如本页各处所示
mono / ui / display 强制使用指定的字体族
caps 字距宽松的文字，西文部分为大写
inkcolor 使用当前激活颜色为文本着色

修饰类

tiny / medium / large / full 限制区块宽度
left / center / right 使区块向左或向右浮动
align-l / align-r / align-c 文本对齐
bleed 将 hero / band / jumbo 延伸至浏览范围的边缘
flattened / raised 移除或添加悬浮层次效果
round 将区块边角设为圆角
opaque 使用当前激活颜色填充
gridlines 叠加浅淡的技术范网格
stamped 添加斜向印章

分页修饰类

将 tabview 包裹在以下任一 div 修饰类中，即可改变分页的表现方式。

tabs-flush 移除分页的边框和背景，仅保留分页卡
tabs-underline 在当前分页卡下方显示强调线
tabs-small 分页卡的内边距减小
查看实际效果

地图修饰类

reveal-rise 分页内文本向上移动并淡入至目标位置
reveal-wipe 分页内文本从左向右逐步显现
reveal-slide 分页内文本从左侧滑入
reveal-pulse 分页内文本闪烁一次后稳定显示
reveal-none 不使用显现动画
panelled 为文本分页添加底面、边框和强调线
labelled 在每个节点下方显示分页卡名称
map-left 将地图置于左侧，分页置于右侧
wide 以全宽形式将地图堆叠在分页上方
查看实际效果

根变量

要修改根变量，请像下面这样在文章中添加一个 CSS 模块。

[[module CSS]]

[[/module]]

然后添加 :root 伪类，并在其中写入所需的变量和值。

[[module CSS]]
:root {
--variable-name: value;
}
[[/module]]

最紧要的根变量：

变量 默认值 单位
--header-title "奥多制药" "文本"
字标的前半部分，使用标题颜色
--header-subtitle "农科" "文本"
Second half of the wordmark, in the division color
字标的后半部分，使用科室颜色
--header-tagline "解决饥饿。难题各个击破。" "文本"
字标下方的口号
--mobile-title / --mobile-subtitle "ORDOPHARM" / "农科" "文本"
窄屏上使用的字标，此时口号会被隐藏
--header-logo 内置标志 url("地址")
左上角的企业标志
--header-title-color 11, 43, 57 RGB 值
字标前半部分的颜色
--header-subtitle-color 8, 121, 190 RGB 值
字标后半部分的颜色
--brand-weight / --division-weight 800 / 400 字重
字标两部分各自的字重
--surface 255, 255, 255 RGB 值
面板、备忘录和标签的背景色
--ink 45, 55, 61 RGB 值
底面上的默认文本颜色
--on-dark 255, 255, 255 RGB 值
填色面板上的文本颜色
--rule-weight .25 rem
面板、横幅和标题上强调线的粗细
--corner 0 rem
整个版式的圆角半径。企业版默认为直角
--band-pad 2.25 rem
band（横幅）内部的纵向内边距
--pane-min 15 rem
可触发网格重排的最小面板宽度
--hero-image none url("地址")
hero 的背景图像；可与 tint 类搭配使用
--backdrop none url("地址") 或渐变
页面背景纹理
--watermark 内置标志 url("地址")
crest 类所使用的水印
--custom-header "内部通讯" "文本"
custom_memo 的标题
--custom-logo 内置标志 url("地址")
显示在备忘录标题右侧的标志
--custom-color 11, 43, 57 RGB 值
custom_memo 的强调色；也可通过颜色类设置
--stamp-text "机密" "文本"
stamped 类所添加斜向印章的文字
--signal-word "注意" "文本"
product_label 上的横幅文本
--fill-time 2.5 秒 (s)
进度条加载所需的时间
--fill-to 100% 百分比
进度条填充到的位置
--track-height .5 rem
进度条高度
--scale1 / --scale2 / --scale3 1.2 / 1 / 1.6 秒 (s)
每组动画的持续时间
--delay1 / --delay2 / --delay3 0 / 1 / 2 秒 (s)
每组动画开始前的延迟
--loop1 / --loop2 / --loop3 1 次数（可设为 infinite）
每组动画的重复次数
--link-volume none 任意 text-transform 值
链接的样式及大小写转换
--link-decor none 任意 text-decoration 值
链接的下划线样式
--abstractor visible 可设为 visible、hidden
页面标题的显示状态
--main-content-width 70 rem
内容栏宽度
--node-icon 带圆环的叶片/火焰符号。 url("地址")
mapview 节点使用的图标。
--counterTime （赋值前不生效。） 秒 (s)
counter-element 从 --from 数到 --to 所需的时间。未设定时默认值为 5 秒。
--symbol-dna （赋值前不生效。） url("地址")
双色双螺旋标志。可赋给 --header-logo 或 --node-icon。
--symbol-dna-mono （赋值前不生效） url("地址")
同一标志的单色版本，供 --watermark/crest 使用。

完整列表请见源代码。

字体

字体 应用 自定类
Archivo / MiSans 字标、标题、大标题、用户界面 display, ui
Inter / OPPO Sans 正文，默认字体
IBM Plex Mono / IBM Plex Sans SC 行情条、细则小字、内网模式 mono
带字距的大写文本 引题与标签 caps

源代码

查看源代码
版式
页面版本: 6, 最后编辑于: 24 Sep 2026 11:45
编辑 评分 (+16) 标签 讨论 (3) 历史记录 附件 打印 网站工具 + 选项
除非特别注明，本页内容采用以下授权方式： Creative Commons Attribution-ShareAlike 3.0 License