网页样式表
这是一个网页样式表,包含了一些CSS样式规则,用于定义网页的布局和外观。以下是各个样式规则的简要说明:
.grid-row
类
该类用于将页面内容按照网格布局排列。通过设置 margin: 0 auto; max-width: 100% !important;
,使得容器元素在水平方向上水平居中,并且最大宽度为100%。.bleed
是 .grid-row
的一个变体,同样具有上述属性,但还额外添加了 margin: 0 auto
以实现左右两端对齐。
.hidden
和 .invisible
类
这两个类用于控制元素的可见性和隐藏性。.hidden
将元素设置为不可见(display: none !important;
),而.invisible
则将元素的可见性设置为隐藏(visibility: hidden;
)。
body>.print-disclaimers
, body>.print-disclaimers h3
, body>.tooltip-panel
类
这些类在打印模式下被隐藏,以提高打印效果。通过媒体查询 @media print
,当浏览器处于打印模式时,.print-disclaimers
、.print-disclaimers h3
和 .tooltip-panel
元素将显示出来,而其他元素会被隐藏。
@keyframes fadeInModalContent
动画
该动画定义了一个名为 fadeInModalContent
的关键帧动画,从透明度为0渐变到透明度为1,用于实现模态内容的淡入效果。
.sr-only
类
.sr-only
类用于屏幕阅读器辅助功能,通过将元素剪裁为只包含可见文本的方式,提供给屏幕阅读器读取。这里使用了 `clip: rect(0, 0, 0, 0); white-space: n