Sonnenfrau
Mitglied
Thread Starter
- Dabei seit
- 15.11.2017
- Beiträge
- 54
- Reaktionspunkte
- 0
Hallo,
ich arbeite mit Bootstrap und habe diese auf "normalen Screen" - mein Laptop im Wohnzimmer hat nur 15" - 1366x768 und auf mobile Endgeräte wie Tablet und Phone optimiert, auf diese beiden kleinen Ports ist auch das Vergrößern der Schrift durch den User möglich, falls er mag. Die Seite sah eigentlich ganz gut aus, jetzt auf meinem neuen Mac mit Retina Display (4K) ist alles ziemlich klein. Die Schrift, die auf andere Geräte einigermaßen groß aussieht, ist auf dem Bildschirm klein, Header-Überschriften sind nicht fett, sondern wirken sehr dünn.
Hat jemand einen Tipp für mich, wie ich das css bearbeiten muss, damit es nicht nur auf die sonst üblichen Geräte gut aussieht, sondern auch auf größere Bildschirme?
Als Beispiel mein CSS für diese beiden Merkmale, die auf dem Mac sehr klein aussehen:
body {
line-height: 1.7em;
font-size: 14px;
font-weight: 400;
background-color: #f0f0f0;
color: #656565;
}
h4.subtitle {
font-size: 18px;
font-weight: 300;
color: #42969e;
margin-bottom: 10px;
line-height: 1.6;
margin-top: 20px;
border-bottom: 1px solid #d1d1d1;
}
ich arbeite mit Bootstrap und habe diese auf "normalen Screen" - mein Laptop im Wohnzimmer hat nur 15" - 1366x768 und auf mobile Endgeräte wie Tablet und Phone optimiert, auf diese beiden kleinen Ports ist auch das Vergrößern der Schrift durch den User möglich, falls er mag. Die Seite sah eigentlich ganz gut aus, jetzt auf meinem neuen Mac mit Retina Display (4K) ist alles ziemlich klein. Die Schrift, die auf andere Geräte einigermaßen groß aussieht, ist auf dem Bildschirm klein, Header-Überschriften sind nicht fett, sondern wirken sehr dünn.
Hat jemand einen Tipp für mich, wie ich das css bearbeiten muss, damit es nicht nur auf die sonst üblichen Geräte gut aussieht, sondern auch auf größere Bildschirme?
Als Beispiel mein CSS für diese beiden Merkmale, die auf dem Mac sehr klein aussehen:
body {
line-height: 1.7em;
font-size: 14px;
font-weight: 400;
background-color: #f0f0f0;
color: #656565;
}
h4.subtitle {
font-size: 18px;
font-weight: 300;
color: #42969e;
margin-bottom: 10px;
line-height: 1.6;
margin-top: 20px;
border-bottom: 1px solid #d1d1d1;
}