Css Firefox默认字体大小问题

Css Firefox默认字体大小问题,css,firefox,cross-browser,Css,Firefox,Cross Browser,灵活的版面使用ems或%作为字体大小单位。通常的做法是使用62.5%的正文字体大小 但是Firefox的默认字体是14px,这使得它的布局比其他默认字体大小为16px的浏览器更小 我们不能将正文字体大小固定为10px,以便在每个浏览器中使用相对大小。您在这里说了很多正确的话: Ems和百分比传统上是用于“可伸缩”布局的单位 CSS中的“级联”包括浏览器自己的样式表。因此,每当您忽略某个元素的样式属性时,它都会在级联中搜索,并从链末端的浏览器样式表中提取这些缺少的属性 如果您希望页面文本的像素完

灵活的版面使用ems或%作为字体大小单位。通常的做法是使用62.5%的正文字体大小

但是Firefox的默认字体是14px,这使得它的布局比其他默认字体大小为16px的浏览器更小


我们不能将正文字体大小固定为10px,以便在每个浏览器中使用相对大小。

您在这里说了很多正确的话:

  • Ems和百分比传统上是用于“可伸缩”布局的单位

  • CSS中的“级联”包括浏览器自己的样式表。因此,每当您忽略某个元素的样式属性时,它都会在级联中搜索,并从链末端的浏览器样式表中提取这些缺少的属性

  • 如果您希望页面文本的像素完美字体处理在浏览器中看起来相同,则需要自己定义字体大小。在
    body
    元素上使用
    px
    应该可以满足您的需求。我不知道为什么这仍然是一个问题。曾经有一段时间,有些人会避免使用px,但现在的浏览器可以很好地处理缩放,因为我怀疑这已经不是什么问题了


    • 此外,除了@Ray的答案

      <>对于像这样的浏览器不兼容,考虑使用重置样式表。

      可以找到一个好的。和

      我将代码粘贴在这里以供参考

      html, body, div, span, applet, object, iframe,
      h1, h2, h3, h4, h5, h6, p, blockquote, pre,
      a, abbr, acronym, address, big, cite, code,
      del, dfn, em, img, ins, kbd, q, s, samp,
      small, strike, strong, sub, sup, tt, var,
      b, u, i, center,
      dl, dt, dd, ol, ul, li,
      fieldset, form, label, legend,
      table, caption, tbody, tfoot, thead, tr, th, td,
      article, aside, canvas, details, embed, 
      figure, figcaption, footer, header, hgroup, 
      menu, nav, output, ruby, section, summary,
      time, mark, audio, video {
          margin: 0;
          padding: 0;
          border: 0;
          font-size: 100%;
          font: inherit;
          vertical-align: baseline;
      }
      /* HTML5 display-role reset for older browsers */
      article, aside, details, figcaption, figure, 
      footer, header, hgroup, menu, nav, section {
          display: block;
      }
      body {
          line-height: 1;
      }
      ol, ul {
          list-style: none;
      }
      blockquote, q {
          quotes: none;
      }
      blockquote:before, blockquote:after,
      q:before, q:after {
          content: '';
          content: none;
      }
      table {
          border-collapse: collapse;
          border-spacing: 0;
      }
      

      Firefox的默认字体不是14px。比例字体为16像素,固定宽度字体为14像素。。。这是用户可以随意设置的偏好。如果您“修复”了正文字体大小,这意味着一些本来会设置20px默认字体的人无法读取您的文本。与其枚举所有元素,现在可能最好使用“*”选择器:{margin:0;padding:0;…}