mehre css datei für verschiedene bildschrimauflösungen

X

xzillen

New Member
Hallo zusammen
Ich habe da mal ne kleine Frage

Ich möchte mehre css datei erstellen für verschiedene bildschirm auflösungen
nur mir ist nicht ganz Klar wie ich das anstellen kann

und das zweite problem ist das header bild muss dann auch an die jeweilige größe angepasst werden via typoScript und das ambesten automatisch anhand der akteullen bildschirmauflösungen

jetzt neine frage wie kann ich das am besten machen .

Typo3 Version 7.6.4
 
G

GwenDragon

Registered User
In CSS gibt es sogenannte media-Queries. Über device-width kannst du das regeln.
Entweder direkt im HTML-Element link über das Attribut media oder im Stylessheet selbst bspw. @media all and (min-width:...).

HTML: 
<link rel="stylesheet" media="all and (min-width:1200px)" href="1200.css">
<link rel="stylesheet" media="all and (min-width:1024px)" href="1024.css">
<link rel="stylesheet" media="all and (min-width:800px)" href="800.css">
<link rel="stylesheet" media="all and (min-width:640px)" href="640.css">
Lies dich mal ein bisschen ein:
https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
https://css-tricks.com/css-media-queries/
http://www.heise.de/ix/artikel/Allen-recht-1058764.html
http://www.mediaevent.de/css/media-query.html
https://www.w3.org/TR/css3-mediaqueries/
http://wiki.selfhtml.org/wiki/CSS/Anwendung_und_Praxis/Tipps_und_Tricks_für_media_queries#relative_Gr.C3.B6.C3.9Fen
 
Last edited by a moderator:
You must log in or register to reply here.
Top