【问题标题】:Header Margin Not Specified Anywhere没有在任何地方指定页眉边距
【发布时间】:2011-10-25 02:33:32
【问题描述】:

我遇到了一个奇怪的问题。我有一个简单的网页,由于某种原因,<h1 /> 标签的margin-topmargin-bottom 超过18px。我的 *.css 文件中没有任何内容指定这一点。 Firefox Firebug 向我展示了应用的样式,但任何地方都没有边距。

在图片中,标题文本所在(或应该在)的div 有限制。但是由于页边距,标题文本被向下推。

这可能是什么原因造成的? firefox/firebug 中是否有任何地方可以准确地告诉我这种风格的来源?它说header 标记继承自body 样式,但仅此而已:

body
{
    font-size: .85em;
    font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
    color: #232323;
    background-color: #fff;
}

有什么想法吗?提前致谢。

【问题讨论】:

    标签: html css firefox firebug stylesheet


    【解决方案1】:

    默认情况下,标题通常有边距。看看使用重置/规范化样式表。

    重置或规范化样式表将您的样式重置为所有浏览器的标准基线。重置和规范化之间的区别在于,在规范化样式表应用合理默认值的情况下,重置清晰的边距、填充等。

    这些链接应该有用:

    【讨论】:

    • +1 CSS 重置样式表的有趣之处。我以前从未听说过。
    • 流行的重置可能是一个很好的起点。了解他们提供的内容,您最终可能会创建自己的自定义重置(根据您的偏好)以在您的项目中使用。
    • 是的,同意。花时间了解他们在做什么并根据您的需要对其进行定制是非常值得的。
    【解决方案2】:

    这是<h1>s 的默认样式。这与<h1>s 的文本大小比段落大的事实相似。这只是默认值。它也可以被覆盖。

    【讨论】:

      【解决方案3】:

      大多数浏览器都添加了一些默认的marginpadding

      尝试重置margin,像这样

      body{
          font-size: .85em;
          font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
          color: #232323;
          background-color: #fff;
          margin:0;    /*  ADD THIS  */
      }
      

      您也可以在h1上重置它

      【讨论】:

      • 我在 h1 标签中重新设置了它,它就像一个魅力。谢谢! +1
      • 边距不被继承,这就是为什么在 body 上设置边距不起作用。
      【解决方案4】:

      所有浏览器都有一个应用于所有页面的默认 CSS。

      使用类似 Yahoo 的 Reset CSS 来取消应用的任何样式。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2011-05-19
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2013-12-18
        • 1970-01-01
        相关资源
        最近更新 更多