Håller på med att göra min sida lite mer dynamisk och en av funktionerna är utseendet vid olika upplösningar

Jag har då skrivit en JS snutt som hjälper mig att styra till rätt css fil
<code>
document.write("<LINK REL='STYLESHEET' HREF='"+screen.width+".css' TYPE='text/css'>");
</code>

Sen har jag ju namnget mina css filer med 640.css 800.css och 1024.css refererat storlekarna på bilderna från de olika filerna.
<code>
<tr>
<td class="bild1"><img src="images/ruta01.gif" class="bild1"></td>
<td class="bild2"><img src="images/ruta02.gif" class="bild2"></td>
</tr>
</code>

detta fungerar ju ok men inte på background
<code>
<tr>
<td class="bild12" background="images/ruta12.gif></td>
</tr>
</code>
frågan är ju nu vad skall jag göra istället, hur får jag bilden till att bli i rätt storlek, den skall ju även repetera sig.

Skapa flera olika stora bilder och namnge dem efter skärmstorleken. Då kan du göra så här:

document.write('<td class="bild12" background="images/ruta12-' + screen.width + '.gif></td>');

Ja men går det att göra utan att behöva göra flera olika stora bilder.

Går det då att justera storleken på bilden i stilmallen.

<b>Går det då att justera storleken på bilden i stilmallen.</b>

Nej.

Jag kör dubbla skärmar en med 1600x1200 och en 1024x768... Tror nog det blir lite jobbigt att skriva en hel hög css'er för alla olika skärmupplösningar etc. Hypotetiskt sätt kan jag köra min browser 1600x1968. Sen finns det ju en hel del som har sina favoriter till vänster eller höger i browsern som tar upp platts och alla kör inte maximerade fönster. Använd en färg från bilden som bakgrundsfärg för att fylla ut brukar funka bra.

De gör jag också. Men jag har lagt in bilder som ramar in en tabellyta i mitten. Där två av dessa bilderna som är bakgrundsbilder, eftersom jag vill att de skall repeterar sig till hela storleken av den cellen (bara på ett håll).

Kan man göra det på annat sätt med tex <div>-taggen och z-index i de cellerna för att få samma resultat.

Jag vill att dessa två cellerna skall kunna växa i sin riktning beroende på innehåll på sidan samt användarens webbfönsterstorlek och upplösning.

Tjena!

I CSS skriver du till denna egenskap för bakgrunden,

background: url('images/ruta12.gif') repeat-x;

Bilden 'ruta12.gif' bildar då en bakgrund som repeteras horisontellt

På den här länken kan du läsa mer om bakgrunder i CSS,

http://www.tizag.com/cssT/background.php

Svenne

Att repetera på det viset är ju bra men det ändrar ju inte storleken på bilden och där inget i CSS1 eller CSS2 för att göra det, har dock sett att det kommer i CSS3.

Frågan är ju hur kan man anpassa utseendet på sin site i förhållande till upplösning och webbfönsterstorlek, utan att behöva göra flera versioner av samma bild.

Jag tog Per Persson råd och körde med det. Det fungerar bra men är inte riktigt nöjd hade hoppats på att slippa göra mer är en backgrundsbild i olika storlekar


Tack alla för er hjälp.................