CSS 实现按钮缩放文字也缩放，并保持文字居中

可以使用 CSS 的 'transform' 属性来实现按钮大小改变时字也跟着缩放的效果，并且保证字在按钮正中间。具体实现方法如下：

HTML 代码：

<button class='btn'>Click Me</button>

CSS 代码：

.btn {
  display: inline-block;
  padding: 10px 20px;
  font-size: 16px;
  text-align: center;
  background-color: #FFC107;
  color: #fff;
  border: none;
  cursor: pointer;
  transition: transform .2s;
}

.btn:hover {
  transform: scale(1.1);
}

.btn span {
  display: inline-block;
  vertical-align: middle;
  transform: translateX(-50%);
}

.btn:hover span {
  transform: scale(1.1) translateX(-50%);
}

其中，按钮的样式设置包括 'padding'、'font-size'、'background-color'、'color'、'border' 等。为了实现按钮大小改变时字也跟着缩放的效果，需要对按钮的 'hover' 状态下应用 'transform: scale()' 属性。同时，为了保证字在按钮正中间，需要使用一个内联元素（例如 'span' 标签）来包裹按钮的文字，并将其垂直居中。最后，使用 'transform: translateX(-50%)' 属性将文字水平居中。在按钮 'hover' 状态下，同时应用 'transform: scale()' 和 'transform: translateX(-50%)' 属性，就可以实现按钮大小改变时字也跟着缩放的效果，并且保证字在按钮正中间。