写一个看起来高级的在表单里面的删除按钮

以下是一个简单的高级删除按钮的示例代码，可以放在表单中使用：

HTML代码：

<form>
  <label for="username">用户名:</label>
  <input type="text" id="username" name="username">
  <button class="delete-button" type="button" aria-label="删除用户名">
    <svg viewBox="0 0 24 24">
      <path fill="currentColor" d="M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0zm4.24 14.24a1.5 1.5 0 0 1-2.12 2.12L12 14.12l-2.12 2.12a1.5 1.5 0 0 1-2.12-2.12L9.88 12 7.76 9.88a1.5 1.5 0 0 1 2.12-2.12L12 9.88l2.12-2.12a1.5 1.5 0 0 1 2.12 2.12L14.12 12z"></path>
    </svg>
  </button>
</form>

CSS代码：

.delete-button {
  border: none;
  background-color: transparent;
  cursor: pointer;
  position: relative;
  top: -2px;
  margin-left: 10px;
}
.delete-button:hover {
  color: #ff0000;
}
.delete-button:focus {
  outline: none;
}
.delete-button svg {
  width: 20px;
  height: 20px;
}
.delete-button svg path {
  fill: #000000;
}

解释：

1. 使用了一个按钮元素（`<button>`）来作为删除按钮，按钮上使用了一个SVG图标，表示一个垃圾桶的图标。

2. 使用`aria-label`属性为按钮添加了一个描述，用于无障碍访问。

3. 使用了一些CSS样式来设置按钮的样式，包括背景、边框等，并且当鼠标悬停在按钮上时，按钮的颜色会变成红色。

4. 使用了SVG图标，可以自定义图标的颜色、大小等属性，灵活性较高。