html - CSS3 标题问题

Question

我正在绞尽脑汁想解决这个问题，但没有成功。 它非常简单:一个带有圆 Angular 的 div ，顶部有一个 h3 (我正在尝试模拟一个带有标题的面板)，非常简单。

出于某种原因，h3 总是有一个空格，感觉像是有边距什么的。

.example-wrapper {
     border: 1px solid #555;
     border-radius: 10px 10px 0 0;}
    
.example-wrapper h3 {
      background: #555;
      color: #fff;
      border-radius: 10px 10px 0 0;
      padding: 10px;
      font-size: 16px;}

<DIV class="example-wrapper">
    <H3>Herry Potter</H3>
</DIV>

如有任何意见，我们将不胜感激。

您可以找到问题here .

Answer 1

是的，H# 默认情况下有边距。设置 H3{ 边距:0; } 来解决它。您始终可以使用开发人员工具来检查元素并查看应用于它们的任何样式。