如何使用 CSS 将 HTML radio 按钮向上移动

可以通过 CSS 来调整 radio 按钮的样式和位置。具体方法如下：

1. 首先，给 radio 添加一个 class 或者 id，方便后续的 CSS 选择器定位。

2. 使用 CSS 的 position 属性，将 radio 的位置设置为相对定位 (position: relative;)。

3. 使用 CSS 的 top 属性，将 radio 向上移动一定的距离，例如：top: -5px;。

4. 可以对 radio 的样式进行自定义，例如修改 radio 的颜色、大小等。

下面是一个示例代码：

HTML 代码：

<input type='radio' name='gender' id='male' class='radio-btn'>
<label for='male'>Male</label>

<input type='radio' name='gender' id='female' class='radio-btn'>
<label for='female'>Female</label>

CSS 代码：

.radio-btn {
  position: relative;
  top: -5px;
  /* 自定义 radio 的样式 */
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #ccc;
}

.radio-btn:checked {
  background-color: #ccc;
}

/* 隐藏原生 radio */
input[type='radio'] {
  display: none;
}

通过上述代码，可以将 radio 向上移动一定的距离，并自定义 radio 的样式。如果需要调整 radio 的位置和样式，可以根据实际需求进行修改。