WebApps mit Frameworks entwickeln - Apps mit HTML5 und CSS3: Fur iPad, iPhone und Android - page 298

gene Schriften für Fließtexte in kleinen Schriftgrößen eher unlesbar sind, setzen Sie
hierfür die Noticia Text ein.
Abbildung 8.3 Die Startseite mit dem Hintergrund und
dem Schatteneffekt, angewendet auf das Bild
Verknüpfen Sie beide Schriften im head -Bereich der Website, direkt vor der Verlin-
kung Ihrer styles.css -Datei:
<link href="http://fonts.googleapis.com/css?family=Leckerli+One"
rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Noticia+Text"
rel="stylesheet" type="text/css">
<link rel="stylesheet" href="styles/styles.css" />
Listing 8.4 Die Verknüpfung von Google Webfonts und allgemeinen Stildefinitionen
Weisen Sie nun in der styles.css die Schriftarten der Überschrift und des Inhaltstextes
zu (Abbildung 8.4):
[data-role=content] h1 {
font-family: 'Leckerli One', cursive;
font-weight: normal;
color:#173b84;
font-size:2em;
line-height:1em;