7 svar · 1 047 visningar · startad av prplxr
Ja, det kanske inte låter så jävligt, men just nu har jag idétorka och vet inte riktigt hur jag ska göra.
Mitt problem är simpelt, jag har en sida med ett antal flikar. Varje sida ska se likadan ut med den skillnaden att vissa element har en speciell färg som är genomgående på hela den fliken. Olika flikar, olika färg. Till exempel har vissa element blå bakgrund, blå länkar, blå gradients osv, medan nästa flik går i gult.
Nu är frågan hur jag ska lösa detta smidigast. Jag har skrivit en stilmall för första fliken och börjar nu tro att detta kan bli ett bekymmer.
En lösning är att ha stilmallen direkt i sidans HTML med varierbara värden som sätts med PHP, dock vill jag inte ha det så pga flera orsaker. Ingen cachning, koden blir lång, oöverskådlig och rörig, osv. En annan lösning är att ha fem olika stilmallar, men då uppstår problemet att jag måste göra alla förändringar i fem olika stilmallar. Lätt att missa något då.
Hjälp mig, bullen! Hur ska jag göra?
Lägg CSS i en separat fil. Sätt klass på body, och låt den klassen sedan styra färgerna på den aktuella sidan.
Exempel:
<body class="blue">
<p>En text med <strong>fetstilt text</strong></p>
</body>
<body class="red">
<p>En text med <strong>fetstilt text</strong></p>
.blue strong { color: #00F; }
.red strong { color: #F00; }
varför inte bara sätt en css klass på bodyn, om det nu bara är färger som skall bytas så kan du ju göra det.
body.blue .tab.active {}
body.yellow .tab.active {}
body.red .tab.active {}
Att ladda ner en extra CSS per flik känns lite onödigt
Det lät till en början som en utmärkt idé, men när jag tänkt på det en stund så inser jag att detta också kommer vara en del jobb. Lat som jag är funderar jag i andra banor. Kan man passa någon variabel till stilmallen? Jag vet att det går I stilmallen, men till?
/red: Jag får nog lov att göra så som ni föreslagit ändå. Jag har kommit till insikten att det på andra sätt blir än mer krångligt att börja styra till det med conditional expressions och allt vad det heter. Det är nog minst jobb på det sätt ni föreslagit. Tack metalboy och voigtann1!
Titta in LESS eller SASS för att få lite struktur i CSS.
och Condetinal Expressions fungera "bara" i IE, kolla in modernizr, html5 boilerplate för att se feature detection.
Titta in LESS eller SASS för att få lite struktur i CSS.
och Condetinal Expressions fungera "bara" i IE, kolla in modernizr, html5 boilerplate för att se feature detection.
Tack för tipsen, jag ska kika på dem för det är i allra högsta grad intressant, dock kommer nog inget av det att användas på denna sidan då den har alldeles för brett spann av användare. Det finns fortfarande en hel del personer (särskilt inom vissa kategorier) som sitter och lurkar med omoderna webbläsare och allt vet vad.
Återigen, tack för tipsen!
Tack för tipsen, jag ska kika på dem för det är i allra högsta grad intressant, dock kommer nog inget av det att användas på denna sidan då den har alldeles för brett spann av användare. Det finns fortfarande en hel del personer (särskilt inom vissa kategorier) som sitter och lurkar med omoderna webbläsare och allt vet vad.
Återigen, tack för tipsen!
Du få nog kolla på det jag har tipsat om... har inget med webbläsare att göra, det är för utvecklare och underlättning att underhålla och utvecklar på en sida.
Okej. Ledsen för min förhastade - och tillika felaktiga - slutsats. Ska kika på det!