Html 如何实现左上角的删除图标

我无法将删除图标与顶部对齐。这就是我尝试过的

.ul技能{
宽度：100%；
保证金：10px 0px 0px 0px；
填充：0px；
浮动：左；
}
李先生{
边框：1px实心#a7dbf5；
列表样式：无；
文字装饰：无；
文本转换：大写；
填充：7px 10px 0px 10px；
背景：bee5f9；
颜色：#074c6f；
字体大小：13px；
文本对齐：左对齐；
浮动：左；
边界半径：50px；
利润率：3px6px；
高度：31px；
}

AJAX

动作脚本3.0（Mac版）

尝试添加到css：

.skills_selector {
  position: relative;
}

.skills_selector a {
  position: absolute;
  top: 0;
  left: 25px;
  transform: translateY(-50%);
}

试试这个

.ul技能{
宽度：100%；
保证金：10px 0px 0px 0px；
填充：0px；
浮动：左；
}
李先生{
边框：1px实心#a7dbf5；
列表样式：无；
文字装饰：无；
文本转换：大写；
填充：7px 40px；
背景：bee5f9；
颜色：#074c6f；
字体大小：13px；
文本对齐：左对齐；
浮动：左；
边界半径：50px；
利润率：3px6px；
位置：相对位置；
}
.技能。移除{
位置：绝对位置；
排名：0；
转换：翻译（0，-50%）；
颜色：红色；
左：20px；
文字装饰：无；
}

AJAX

动作脚本3.0（Mac版）

关闭图标需要使用

位置：绝对

，并使用

顶部

和

左侧

值将其对齐…还记得将

位置：相对

设置为其父图标

li

.ul技能{
宽度：100%；
保证金：10px 0px 0px 0px；
填充：0px；
浮动：左；
}
李先生{
边框：1px实心#a7dbf5；
列表样式：无；
文字装饰：无；
文本转换：大写；
填充：7px 10px 0px 10px；
背景：bee5f9；
颜色：#074c6f；
字体大小：13px；
文本对齐：左对齐；
浮动：左；
边界半径：50px；
利润率：3px6px；
高度：31px；
位置：相对位置；
}
李安先生{
位置：绝对位置；
顶部：-10px；
左：0px；
背景：红色；
宽度：20px；
高度：20px；
边界半径：50%；
显示器：flex；
对齐项目：居中；
证明内容：中心；
文字装饰：无；
}

AJAX

动作脚本3.0（Mac版）

希望这能满足您的需求

.skills ul {
    width: 100%;
    margin: 10px 0px 0px 0px;
    padding: 0px;
    float: left;
}

.skills li {
  position:relative;
    border: 1px solid #a7dbf5;
    list-style: none;
    text-decoration: none;
    text-transform: capitalize;
    padding: 7px 10px 0px 10px;
    background: #bee5f9;
    color: #074c6f;
    font-size: 13px;
    text-align: left;
    float: left;
    border-radius: 50px;
    margin: 3px 6px;
    height: 31px;
}
.skills li>a{
  position:absolute;
  padding:3px;
  top:-15px;
  background-color:orange;
  color:white;
  border-radius:50%;
}

---

我怎样才能给背景圈加上红色。？如图所示。！