这段CSS代码定义了一个名为"Guardian Headline Full"的自定义字体家族，包含多种字重和样式。它涵盖了细体、常规体、中等体和半粗体，每种字重均提供常规和斜体两种样式。字体文件以WOFF2、WOFF和TrueType格式提供，托管在《卫报》的服务器上。
@font-face {
font-family: Guardian Headline Full;
src: url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-Bold.woff2) format("woff2"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-Bold.woff) format("woff"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-Bold.ttf) format("truetype");
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: Guardian Headline Full;
src: url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-BoldItalic.woff2) format("woff2"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-BoldItalic.woff) format("woff"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-BoldItalic.ttf) format("truetype");
font-weight: 700;
font-style: italic;
}
@font-face {
font-family: Guardian Headline Full;
src: url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-Black.woff2) format("woff2"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-Black.woff) format("woff"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-Black.ttf) format("truetype");
font-weight: 900;
font-style: normal;
}
@font-face {
font-family: Guardian Headline Full;
src: url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-BlackItalic.woff2) format("woff2"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-BlackItalic.woff) format("woff"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-headline/noalts-not-hinted/GHGuardianHeadline-BlackItalic.ttf) format("truetype");
font-weight: 900;
font-style: italic;
}
@font-face {
font-family: Guardian Titlepiece;
src: url(https://assets.guim.co.uk/static/frontend/fonts/guardian-titlepiece/noalts-not-hinted/GTGuardianTitlepiece-Bold.woff2) format("woff2"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-titlepiece/noalts-not-hinted/GTGuardianTitlepiece-Bold.woff) format("woff"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-titlepiece/noalts-not-hinted/GTGuardianTitlepiece-Bold.ttf) format("truetype");
font-weight: 700;
font-style: normal;
}
div#maincontent:focus {
box-shadow: none !important;
}
#init-1, #end-1, #init-2, #end-2, #init-3, #end-3, #init-4, #end-4, #init-5, #end-5,
h2#interactive-slot-1, h2#interactive-slot-2, h2#interactive-slot-3, h2#interactive-slot-4, h2#interactive-slot-5 {
visibility: hidden;
height: 0;
margin: 0;
padding: 0;
border: none;
}
:root {
--fires-bg-color: #0b0a32;
--headline-bg-color: #0b0a32;
--custom-text-color: #fff;
--article-border: #fac99b;
--primary-accent-color: #fac99b;
--secondary-accent-color: #ff5943;
--tertiary-accent-color: #59433c;
--block-quote-fill: var(--primary-accent-color);
--share-button: var(--primary-accent-color);
--share-button-hover: var(--fires-bg-color);
--interactive-block-background-datawrapper: transparent;
--branding-border: var(--tertiary-accent-color);
--section-background: #ffffff;
--interactive-block-background: transparent;
--caption-text: var(--primary-accent-color);
--sub-meta-label-text: #fff;
--dateline: var(--secondary-accent-color);
--sub-meta-background: --fires-bg-color;
--sub-meta-text: var(--primary-accent-color);
--sub-meta-text-hover: var(--fires-bg-color);
--straight-lines: var(--primary-accent-color);
--article-meta-lines: var(--primary-accent-color);
--article-background: var(--fires-bg-color);
}
li:before {
background-color: var(--secondary-accent-color) !important;
}
body {
background-color: var(--fires-bg-color) !important;
}
.content--interactive {
background-color: transparent !important;
}
body .content--interactive h1,
body .article h1 {
order: 1;
text-align: left;
color: #fff;
min-width: 50%;
margin: 0 auto 13px 10px;
color: var(--secondary-accent-color) !important;
}
.content__standfirst p {
margin: 0 auto 13px 10px;
}
.content__label__link span {
margin: 0 0 0 10px !important;
}
容器摘要具有10像素的左外边距，并使用特定的强调色作为文本颜色。具有data-print-layout属性设置为"hide"的元素不显示。
交互式内容和文章内的段落和主标题使用自定义文本颜色。主标题字体大小设置为3 rem，在中等尺寸屏幕上调整为2.5 rem。次级标题采用细体字重、32像素大小和自定义文本颜色进行样式设置。
交互式内容中的介绍性文本使用主强调色，最大宽度为320像素。文章和交互式内容内的链接使用次级强调色。标题标签链接也使用主强调色。
主体使用CSS自定义属性为文本、背景、线条、按钮、高亮和特定品牌颜色定义全面的配色方案。整体页面背景使用自定义变量设置。
文章标题和正文具有透明背景。交互式内容的主列调整其宽度并移除默认外边距。第一个图形和第一个原子元素具有彩色的底部边框。
主交互式文章容器跨越整个视口宽度，无水平滚动，并使用特定的网格区域。在较大屏幕上，布局使用多列网格。文章正文占据整个网格并隐藏溢出。
边框元素被隐藏，主内容区域无上边距。对于非常宽的屏幕，网格定义了一个1300像素的中央列，并为非正文元素设置左外边距。该中央列和边距在各种断点处针对不同屏幕宽度进行调整。
交互式网格中的非正文元素具有更高的堆叠顺序，并在较大屏幕上接收侧边内边距。在Android和iOS上，文章正文无内边距，标题绝对定位且背景透明。作者署名文本和元部分内的链接在这些移动平台上也保持透明。
署名、作者链接和标题标签设置为使用次级强调色。元署名组件具有10像素的左外边距。作者链接具有13像素的底部外边距。标题和标题部分具有5vh的上内边距，标题还具有4像素的底部内边距。线条元素和元部分边框在Android和iOS上隐藏。
在Android和iOS上，发布日期具有4像素的上内边距。元部分中的社交媒体按钮使用次级强调色作为文本和边框颜色，其图标填充相同颜色。内容元容器中的图标被隐藏。交互式网格中的所有非正文元素具有10像素的左右内边距。元区域中的社交媒体部分无上边框，评论部分被隐藏。分享按钮在悬停时变为次级强调色并带有白色图标。
第一个原子元素图形跨越所有列，底部外边距为12像素。沉浸式元素图形为全宽，最多1260像素，无侧边外边距，并从倒数第二列跨越到第二列。
在小屏幕（30em以下）上，主列中的所有非沉浸式元素具有10像素的侧边外边距。在中等屏幕（46.25em及以上）上，主交互式列具有相对位置，左侧有垂直线。非原子元素放置在正文网格列中。
针对不同屏幕尺寸，布局使用特定的网格模板：
- 在46.25em至61.24em之间：三列布局。
- 在61.25em至71.24em之间：四列布局。
- 在71.25em至81.24em之间：五列布局，带有左右列。
- 在81.25em以上：五列布局，列更宽。
标题距离顶部20dvh，全宽，无上边距。在20em至46.24em之间的屏幕上，它移动到10dvh。标题标签无边框。
标题也在20dvh处，全宽，具有深色背景、内边距和上边框。在中等屏幕上，它移动到10dvh。
导语位于20dvh处，全宽，具有深色背景和内边距。在中等屏幕上，它移动到10dvh。
交互式网格定义了标题、导语、媒体、线条、元和正文的区域。
元部分全宽，位于20dvh处，具有深色背景和z-index为5。在中等屏幕上，它移动到10dvh。日期行具有10像素的左外边距。
svelte-scroller-outer显示为块级元素，具有相对定位。
CSS代码为滚动组件定义样式，并包含Guardian Headline Full字体家族的@font-face规则。滚动组件具有块级显示、相对定位和全宽。其前景设置为更高的z-index并清除浮动，而背景容器绝对定位，无指针事件，并针对变换更改进行了优化。@font-face规则从《卫报》服务器加载Guardian Headline Full字体的各种字重和样式，指定细体、常规体、中等体和半粗体的常规和斜体变体，支持WOFF2、WOFF和TTF格式。
《卫报》为其标题和标题块使用自定义字体。这些字体以多种格式（如WOFF2、WOFF和TTF）从其服务器加载，以确保广泛的浏览器兼容性。每种字体变体（如粗体或斜体）都定义了特定的字重和样式。
页面包含一个加载覆盖层，带有在数据获取期间出现的旋转动画。主内容区域具有全屏地图和滚动叙事部分。该部分内的文本框使用《卫报》的Egyptian Web字体作为正文文本，具有样式化的背景、边框和排版。某些文本跨度使用彩色背景进行强调。
CSS定义了12像素的边框半径，并加载Guardian Headline Full字体家族。这包括《卫报》服务器上不同字重和样式（细体、常规体、中等体、半粗体及其斜体版本）的多个字体文件。文件以WOFF2、WOFF和TrueType格式提供，以确保广泛的浏览器兼容性。
2024年，每天有超过360平方公里的森林被野火烧毁——面积超过马耳他。到年底，超过134,000平方公里被火焰吞噬，总面积大于英格兰。过去24年，野火已摧毁了1.5……
世界正失去相当于蒙古面积的森林，专家警告这一速度不可持续。虽然野火是生态系统的自然组成部分，但近几十年来，富含碳的森林中野火的规模、频率和强度急剧增加。
世界资源研究所（WRI）的研究显示，现在火灾摧毁的树木覆盖面积是二十年前的两倍多。仅2024年，就有135,000平方公里的森林被烧毁，使其成为有记录以来最极端的野火年份。
有趣的是，塔斯马尼亚大学的研究表明，其他景观中的火灾并未以相同方式增加。全球燃烧总面积实际上几十年来一直在下降，部分原因是非洲农场的扩张减缓了火势蔓延。然而，森林已成为火灾的新热点。
森林火灾的增加是明显的。有记录以来最严重的五个年份中有四个发生在2020年之后。WRI研究强调，2024年是首次同时发生跨越热带潮湿森林（如亚马逊）和北方森林（如加拿大）的重大火灾。
巴西、玻利维亚、俄罗斯、澳大利亚和加拿大等国近年来都经历了最严重的火灾季节。化石燃料污染加剧的热浪正在推高极端火灾的风险。
例如，俄罗斯自2020年以来经历了三个最严重的火灾季节，其中2021年最为严重。约45,000平方公里的森林被烧毁，主要在西伯利亚和远东地区。火灾向北延伸如此之远，以至于到达了北极圈内的永久冻土区域。2021年，卫星记录了有史以来最北端的野火。随着更多永久冻土融化——干燥土壤、变暖空气并降低湿度——科学家预计野火将“急剧增加”。
提供的文本似乎是加载"Guardian Headline Full"字体家族各种字重和样式（如常规、斜体、粗体等）的一系列CSS @font-face规则。每条规则指定字体名称、不同文件格式（WOFF2、WOFF、TTF）的源URL以及相应的字重和样式。
@font-face {
font-family: Guardian Titlepiece;
src: url(https://assets.guim.co.uk/static/frontend/fonts/guardian-titlepiece/noalts-not-hinted/GTGuardianTitlepiece-Bold.woff2) format("woff2"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-titlepiece/noalts-not-hinted/GTGuardianTitlepiece-Bold.woff) format("woff"),
url(https://assets.guim.co.uk/static/frontend/fonts/guardian-titlepiece/noalts-not-hinted/GTGuardianTitlepiece-Bold.ttf) format("truetype");
font-weight: 700;
font-style: normal;
}
div#maincontent:focus {
box-shadow: none !important;
}
body {
--primary-text-color: #121212;
--secondary-text-color: #707070;
--tertiary-text-color: #707070;
--primary-bg-color: #ffffff;
--secondary-bg-color: #f3f3f3;
--tertiary-bg-color: #f6f6f6;
--primary-line-color: #333333;
--secondary-line-color: #dcdcdc;
--border-divider-color: #dcdcdc;
--axis-color: #bababa;
--primary-button-color: #121212;
--primary-button-text-color: #ffffff;
--primary-button-highlight-color: #333333;
--highlight-color: #ffe500;
--highlighted-text-color: #121212;
--info-color: #00b2ff;
--news-grey-01: #121212;
--news-grey-02: #707070;
--news-grey-03: #a1a1a1;
--news-grey-04: #bababa;
--news-grey-05: #dcdcdc;
--news-grey-06: #f3f3f3;
--news-core-01: #005689;
--news-core-02: #0094da;
--news-core-03: #c70000;
--news-core-04: #23b4a9;
--news-core-05: #494949;
--news-core-06: #cca36e;
}
@media (prefers-color-scheme: dark) {
:root:not([data-color-scheme=light]) body {
--primary-text-color: #dcdcdc;
--secondary-text-color: #c8c8c8;
--tertiary-text-color: #999999;
--primary-bg-color: #1a1a1a;
--secondary-bg-color: #383838;
--tertiary-bg-color: #121212;
--primary-line-color: #dcdcdc;
--secondary-line-color: #707070;
--border-divider-color: #606060;
--axis-color: var(--news-grey-04);
--primary-button-color: #383838;
--primary-button-text-color: #dcdcdc;
--primary-button-highlight-color: #707070;
--highlight-color: #cda500;
--highlighted-text-color: #121212;
--info-color: #0077b6;
--news-grey-01: #dcdcdc;
--news-grey-02: #c8c8c8;
--news-grey-03: #a1a1a1;
--news-grey-04: #707070;
--news-grey-05: #494949;
--news-grey-06: #383838;
--news-core-01: #0077b6;
--news-core-02: #00b2ff;
--news-core-03: #e33824;
--news-core-04: #23b4a9;
--news-core-05: #494949;
--news-core-06: #cca36e;
}
}
@font-face {
font-family: Guardian Headline Full;
src: url(https://assets.guim.co.uk/
