# 获取内置类名

获取常用工具类。

### Hook

`useClassNames`

```jsx
import React from "react";
import { useClassNames } from "@tencent/tea-component/lib/util";

function Demo() {
  const { Padding } = useClassNames();
  return (
    <div className={Padding["5n"]}>Demo</div>
  );
}
```

### HOC

`withClassNames`

```jsx
import React, { Component } from "react";
import { withClassNames } from "@tencent/tea-component/lib/util";

@withClassNames
class Demo extends Component {
  render() {
    const { teaClassNames: { Padding } } = this.props;
    return (
      <div className={Padding["2n"]}>Demo</div>
    );
  }
}
```

## 当前支持的工具类

<!-- <Half> -->

### 间距

用于处理元素之间，或元素内部的间距。

- `Margin`、`Margin.Top`、`Margin.Bottom`、`Margin.Left`、`Margin.Right`
- `Padding`、`Padding.Top`、`Padding.Bottom`、`Padding.Left`、`Padding.Right`

后面需要指定 `${x}n` 作为间距基数，当前 1n 为 4px，支持 1-5 倍

[Example: Margin](./_example/MarginExample.jsx)

[Example: Padding](./_example/PaddingExample.jsx)

### 重置字号

`FontSizeReset`

在字号被设为 0 处重置字号。

[Example: Font](./_example/FontExample.jsx)

<!-- </Half> -->