html - CSS：带边​​框的 h2::first-letter 需要 h2 其余部分的边距

Question

我希望可以回答这个问题。更多细节：我想在 ::first-letter 之后创建额外的间距，但是当我向它添加边距时会扩展边框。我试图找到一个解决方案并找到 ::after 但这对我不起作用..

使用的 CSS：

h2::first-letter {
font-size: 200%;
font-family: Times;
padding-left: 5px;
padding-right: 3px;
border:2px solid black;                                                 
}

h2{
    font-family:"Helvetica Neue",HelveticaNeue,Arial,sans-serif;
    font-weight:normal;
}

任何提示或改进都会非常棒！我对它很陌生，但我以相当快的速度学习它。

Answer 1

您需要在声明中添加margin-right一个h2:first-letter。

有关示例，请参见此小提琴。

h2::first-letter {
   font-size: 200%;
   font-family: Times;
   padding-left: 5px;
   padding-right: 5px;
   margin-right: 3px;
   border:2px solid black;                                                 
}