# @atlaskit/css-reset 中文文档

规范地址：https://npmcn.com/package/%40atlaskit/css-reset/

版本：8\.4\.10
npm 元数据更新时间：2026-11-04T23:31:11.552Z
中文译文更新时间：2026-11-07T02:32:16.998Z
软件包许可：Apache-2\.0

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40atlaskit/css-reset
原文对照：https://npmcn.com/package/%40atlaskit/css-reset/?lang=original
项目主页：https://atlassian.design/components/css-reset
源码仓库：https://bitbucket.org/atlassian/atlassian-frontend-mirror

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：111 kB，54 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：2 个
- peer 依赖：react ^18\.2\.0 \|\| ^19\.0\.0
- 首次发布：2017-01-29T23:41:41.033Z
- 最新版本发布：2026-11-04T23:31:11.398Z
- 近 30 天下载量：155003（2026-10-07 至 2026-11-05，npm 官方下载统计）
- 已发布版本数：161（近 12 个月 32 个）

## 中文简介

Atlassian设计系统的基础样式表.

## 安装

```sh
npm install @atlaskit/css-reset
```

也可以使用：`pnpm add @atlaskit/css-reset`、`yarn add @atlaskit/css-reset`、`bun add @atlaskit/css-reset`

## README

# CSS 重设

ADG 的基础样式表 .

## 安装

```sh
yarn add @atlaskit/css-reset
```

## 使用量

[查看文档](https://atlassian.design/components/css-reset/)。 。 。 .

## 独立的滚动条外观

不消耗完整 CSS 重置的产品只能导入统一的滚动条样式:

```ts
import '@atlaskit/css-reset/scrollbars.css';
```

样式表不活动,直到产品添加 `data-scrollbar-harmonisation` 页:1 文档根。 产品自主特色门评价和属性清理. 音轨总是 透明度;不需要单独的透明属性.

只更改颜色: 拇指使用 `color.background.accent.gray.subtle` 轨道是 透明,一次设定为 `scrollbar-color` 在根和继承。 滚动栏大小、能见度 和覆盖行为保持原生状态,所以操作系统偏好如macOS"当滚动时"是 荣誉和申请 当改变。 自定义 WebKit 滚动条缩放因浏览器而未使用 永远不要把它画成覆被。 没有浏览器 `scrollbar-color` 支持保持本地颜色。 强迫 颜色使用浏览器颜色.

在Chrimium,一个非自动 `scrollbar-color` 禁用 `::-webkit-scrollbar` 样式在同一元素上. 拥有自定义 WebKit 滚动栏的组件应当设置自己的 `scrollbar-color`,或 `scrollbar-color: auto`在他们的卷轴容器.

细微的符号在光线模式下与白页表面的相去相近3.24:1 2.85: 1 与 #1F1F21 页面表面的暗模式相对; 升起和上覆的对比度较低 表面 。 统一处理法接受这种对比,但并不主张 无障碍兼容性。 油漆宽度和分配宽度不是目标大小的兼容性 评估.

### 避免在安全部门改革网页上出现不统一滚动条的闪光

上述属性通常安装在 `document.documentElement` 运行时间 `useScrollbarHarmonisation` (单位:千美元)`@atlaskit/app-provider/use-scrollbar-harmonisation`) (中文(简体) ). 在一个 服务器发送的页面中, 钩子只运行客户端, 因此滚动条会短暂地不协调 直到效应起火。 生产的产品 `<html>` 从服务器侧模板可以调用 `getScrollbarHarmonisationHtmlAttrs` (单位:千美元)`@atlaskit/app-provider/get-scrollbar-harmonisation-html-attrs`并将其结果传播到 服务器已交付 `<html>` 元素,因此属性——因此这些CSS规则——存在 从最初的油漆.

## 常见问题

### @atlaskit/css-reset 是什么？

Atlassian设计系统的基础样式表\.

### 如何安装 @atlaskit/css-reset？

在项目目录运行 npm install @atlaskit/css-reset，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（^18\.2\.0 \|\| ^19\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @atlaskit/css-reset 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @atlaskit/css-reset 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @atlaskit/css-reset 可以商用吗？

@atlaskit/css-reset 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @atlaskit/css-reset 的下载量有多少？

根据 npm 官方下载统计，@atlaskit/css-reset 在 2026/10/07 – 2026/11/05 这 30 天内被下载 155,003 次，日均约 5,167 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @atlaskit/css-reset 还在维护吗？

最新版本 8\.4\.10 发布于 2026/11/05（2 天前）；至今共发布 161 个版本，其中过去 12 个月发布了 32 个；首次发布于 2017/01/30。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。