如何在CSS中设置自定义HR元素的样式？

有人知道如何在CSS中使用

2边框设计这样的样式吗：


hr{
颜色：红色；
边框顶部：10px实心；
左边框：100px实心；
高度：10px；
}
根据需要更改零件类的宽度，与更改边框的宽度相同


.full{
身高：0；
边框：5px纯红；
保证金：0；
}
.部分{
身高：0；
宽度：300px；
边框：5px纯红；
保证金：0；
}
一种在伪元素之后、之前的方法


hr{
边界：无；
}
hr：之后，
人事：以前{
显示：块；
内容：''；
背景色：红色；
高度：10px；
}
人力资源部：之后{
宽度：20%；
}
人事：以前{
宽度：100%；
}
您可以设置
的样式，并为底部零件使用伪类


hr{
边框：10px红色固体；
}
之前{
内容：“；
显示：块；
位置：绝对位置；
顶部：28px；
左：8px；
宽度：150px；
背景：红色；
高度：20px；
}
到目前为止，您尝试了什么？
使用了
边框
，因此，覆盖其边框值我采用了这种方法。谢谢在我的电脑（ubuntu/chrome）上，我看到