Material-ui: Zu kleine Schrift in der Reaktions-App mit Typoskript-Beispiel

Erstellt am 5. März 2018  ·  3Kommentare  ·  Quelle: mui-org/material-ui

Ich habe meine App auf https://github.com/mui-org/material-ui/tree/v1-beta/examples/create-react-app-with-typescript basiert

Ich versuche, eine sehr einfache Navigationsleiste einzuschließen:

const styles: StyleRulesCallback<'root'> = theme => ({
  root: {
    textAlign: 'center',
    paddingTop: theme.spacing.unit * 20,
  },
});

class App extends React.Component<WithStyles<'root'>, {}> {

  render() {
    return (
      <div className={this.props.classes.root}>

          <AppBar>
            <Toolbar>
              <Typography variant="title" color="inherit">
                 Title
              </Typography>
            </Toolbar>
          </AppBar>

      </div>
    );
  }
}

export default withRoot(withStyles(styles)<{}>(App));

Es scheint, dass alle Schriftarten in Material-UI-Komponenten klein sind. Tasten, auswählen, typografisch.

Zum Beispiel, warum ich das sehe:
Imgur

anstelle von https://material-ui-next.com/demos/app-bar/

Ich meine, warum ist die Schrift so klein?

image

question

Hilfreichster Kommentar

Benutzer können dieses Eingabehilfenverhalten deaktivieren, indem sie den folgenden Stil festlegen:

html {
  font-size: 16px;
}

Alle 3 Kommentare

Für das von Typography gerenderte h2 -Element wird das richtige font-size für diese Variante angewendet: 1.3125rem .

Als Einheit für die Schriftgröße ist rem ein Vielfaches der Standard-Basisschriftgröße , die normalerweise für das Element html . Überprüfen Sie Ihr Dokument. Ist für Ihr html -Element eine Schriftgröße definiert?

Könnten Sie dies in

Abgesehen davon ist diese Art von Dingen perfekt für StackOverflow . Wenn Sie eine Frage stellen, erhalten Sie wahrscheinlich Hilfe. Es gibt dort viele aktive Community-Mitglieder. Probleme unterscheiden sich von Support-Fragen.

Wir werden uns um weitere Informationen von Ihnen bemühen, aber auf den ersten Blick scheint dies kein Problem mit der Material-Benutzeroberfläche zu sein.

Benutzer können dieses Eingabehilfenverhalten deaktivieren, indem sie den folgenden Stil festlegen:

html {
  font-size: 16px;
}
War diese Seite hilfreich?
0 / 5 - 0 Bewertungen