Avatar billede nicocarlos Nybegynder
27. august 2006 - 00:59 Der er 18 kommentarer og
1 løsning

problem med baggrund bliver gentaget

Hejsa.

Har et problem med min baggrund i html, den er 100% i height, men når så mit design bliver for udvidet så begynder den forfra og da toppen er anderledes en bunden kommer toppen igen efter et stykke tid

det skulle den helst ikke men bare forsætte i det samme som bunden kan man lave det på en måde?

nicocarlos
Avatar billede mclemens Nybegynder
27. august 2006 - 01:13 #1
[ det skulle den helst ikke men bare forsætte i det samme som bunden kan man lave det på en måde? ] Du kan sætte baggrunds farven som skal bruges resten af vejen:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<style type="text/css">
html,body{margin:0px;padding:0px;height:100%;}
body{background:#f00 url('billede.jpg') no-repeat;}
</style>

</head><body>
a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>v
</body></html>



eller du kan sætte baggrunden fast:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<style type="text/css">
html,body{margin:0px;padding:0px;height:100%;}
body{background:url('billede.jpg') no-repeat fixed;}
</style>

</head><body>
a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>v
</body></html>






alternativet er at have det bund stykke af billedet der skal
gentages nedad efter de 100% i html tagget som her:



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<style type="text/css">
html,body{margin:0px;padding:0px;height:100%;}
html{background:url('billede2.jpg');}
body{background:url('billede.jpg') no-repeat;}
</style>

</head><body>
a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>v
</body></html>







... i mit eget tilfælde bruger jeg en baggrund der fader fra en farve til den anden og så (løsning kunne her være 1px bredt x 510px højt og så <style type="text/css">
body{background: #000 url('billede.jpg') repeat-x;}
</style> hvor #000 så var baggrunden den skulle fortsætte med)


Her er lige et svar samtidig hvis du kunne bruge det :)
Avatar billede nicocarlos Nybegynder
27. august 2006 - 01:27 #2
jeg forstod ikke helt det der, kan jeg evt give dig et link hvis jeg lige uploader mit problem?
Avatar billede nicocarlos Nybegynder
27. august 2006 - 01:27 #3
Jeg tror du kan se hvad der skal gøres hurtigt :) er ikke så skarp til det med opsætning af bg og sån
Avatar billede nicocarlos Nybegynder
27. august 2006 - 01:33 #4
jeg er med på den sidste du laver problemet er bare at mit fader ud i et "billede"
Avatar billede mclemens Nybegynder
27. august 2006 - 01:37 #5
Joh, kast bare et link - men jeg smutter nok snart til køjs,
så tør ikke love om jeg når det iaften eller iløbet af imorgen ...
Avatar billede nicocarlos Nybegynder
27. august 2006 - 01:45 #6
okay det er oppe om 1 min , håber du kan nå det hehe :D
Avatar billede nicocarlos Nybegynder
27. august 2006 - 01:47 #7
http://alt-muligt.dk/tester/test.html

Hvis du kan se den ude i siden, det er mig der har lavet en alternativ baggrund det billede ved siden af er et billede lavet 100% også derfor de firkanter er større, håber du kan hjælpe :D
Avatar billede mclemens Nybegynder
27. august 2006 - 02:12 #8
Rettelse af struktur på tabellen har jeg ikke gjort (et stykke tid siden jeg har rodet med tabeller - laver det meste via. css og div's idag) ... her er lige et eksempel på rettelsen:




lav en fil der hedder css.css med dette indhold:

html,body{height:100%;padding:0px;margin:0px;}
html{background:url('images/index_15.jpg');}
body{background:url('images/bg.jpg') repeat-x;}

#table_01{width:801px;height:601px;border-collapse:collapse;margin:0px auto;}
#table td{padding:0px;}





og så prøv denne tester.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title>indexslice</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><link rel="stylesheet" href="css.css" type="text/css"></head><body>

<table id="table_01">

    <tr>
        <td colspan="12">
            <img src="images/index_01.jpg" width="800" height="31" alt=""></td>
        <td>

            <img src="images/spacer.gif" width="1" height="31" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="3">
            <img src="images/index_02.jpg" width="108" height="87" alt=""></td>
        <td colspan="8" width="587" height="74">
            </td>
        <td colspan="2" rowspan="4">
            <img src="images/index_04.jpg" width="105" height="91" alt=""></td>

        <td>
            <img src="images/spacer.gif" width="1" height="74" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="5">
            <img src="images/index_05.jpg" width="76" height="82" alt=""></td>
        <td colspan="6">
            <img src="images/index_06.jpg" width="511" height="3" alt=""></td>
        <td>

            <img src="images/spacer.gif" width="1" height="3" alt=""></td>
    </tr>

    <tr>
        <td rowspan="4"><a href="index.html" target="_parent"><img src="images/index_07.jpg" width="135" height="79" alt="" border="0"></a></td>

        <td rowspan="4"><img src="images/index_08.jpg" width="1" height="79" alt=""></td>

        <td colspan="2" rowspan="4"><a href="profil.html" target="_parent"><img src="images/index_09.jpg" width="127" height="79" alt="" border="0"></a></td>

        <td rowspan="4"><a href="rapport.html" target="_parent"><img src="images/index_10.jpg" width="125" height="79" alt="" border="0"></a></td>

        <td rowspan="4"><a href="kontakt.html" target="_parent"><img src="images/index_11.jpg" width="123" height="79" alt="" border="0"></a></td>

        <td><img src="images/spacer.gif" width="1" height="10" alt=""></td>
    </tr>

    <tr>
        <td rowspan="2">

            <img src="images/index_12.jpg" width="107" height="14" alt=""></td>
        <td rowspan="3">
            <img src="images/index_13.jpg" width="1" height="69" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="4" alt=""></td>
    </tr>
    <tr>
        <td colspan="2">
            <img src="images/index_14.jpg" width="105" height="10" alt=""></td>

        <td>
            <img src="images/spacer.gif" width="1" height="10" alt=""></td>
    </tr>
    <tr>
        <td rowspan="8">
            <img src="images/index_15.jpg" width="107" height="100%" alt=""></td>
        <td colspan="2" rowspan="5">
            <img src="images/index_16.jpg" width="105" height="100%" alt=""></td>
        <td>

            <img src="images/spacer.gif" width="1" height="55" alt=""></td>
    </tr>
    <tr>
        <td colspan="9">
            <img src="images/index_17.jpg" width="588" height="19" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="19" alt=""></td>
    </tr>
    <tr>

        <td rowspan="6">
            <img src="images/index_18.jpg" width="1" height="394" alt=""></td>
        <td colspan="5">
            <img src="images/profil_19.jpg" width="237" height="43" alt=""></td>
        <td colspan="3">
            <img src="images/profil_20.jpg" width="350" height="43" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="43" alt=""></td>
    </tr>

    <tr>
        <td>
            <img src="images/index_21.jpg" width="38" height="100%" alt=""></td>
       
      <td colspan="2" bgcolor="FFFFFF"><br>
      </td>
        <td colspan="2">
            <img src="images/index_23.jpg" width="26" height="100%" alt=""></td>
       
      <td colspan="3" rowspan="2" bgcolor="FFFFFF"><p> <br>

          <br>
          <br>
          <br>
          <br>
          <br>
          <br>
          <br>
          <br>
          <br>

        </p>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>

        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>

      </td>
        <td><img src="images/spacer.gif" width="1" height="264" alt=""></td>
    </tr>
    <tr>
        <td colspan="5" rowspan="2"><img src="images/index_25.jpg" width="237" height="100%" alt=""></td>

        <td><img src="images/spacer.gif" width="1" height="14" alt=""></td>

    </tr>
    <tr>
        <td colspan="4" rowspan="2" width="352" height="47"></td>

        <td rowspan="3"><img src="images/index_27.jpg" width="103" height="73" alt=""></td>

        <td><img src="images/spacer.gif" width="1" height="5" alt=""></td>
    </tr>

    <tr>
        <td colspan="5"><img src="images/index_28.jpg" width="237" height="42" alt=""></td>

        <td><img src="images/spacer.gif" width="1" height="42" alt=""></td>
    </tr>
    <tr>
        <td colspan="9"><img src="images/index_29.jpg" width="589" height="26" alt=""></td>

        <td><img src="images/spacer.gif" width="1" height="26" alt=""></td>
    </tr>
    <tr>
        <td><img src="images/spacer.gif" width="107" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="1" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="38" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="38" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="135" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="1" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="25" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="102" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="125" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="123" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="2" height="1" alt=""></td>

        <td><img src="images/spacer.gif" width="103" height="1" alt=""></td>

        <td></td>
    </tr>


</table>

</body></html>










hvis du bruger den skal

<link rel="stylesheet" href="css.css" type="text/css"> nok rettes til f.eks.:
<link rel="stylesheet" href="/tester/css.css" type="text/css"> eller
<link rel="stylesheet" href="/css.css" type="text/css"> hvis css filen lægger i rod mappen ...



nat, nat ;)
Avatar billede mclemens Nybegynder
27. august 2006 - 02:18 #9
her er lige en fil mere inden jeg hopper til køjs...




<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title>indexslice</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
html,body{margin:0px;padding:0px;height:100%;}
body{background:#e2e1dd}
#fr{border-collapse:collapse;height:100%;width:100%;}
#fr td{padding:0px;text-align:center;}
</style>

</head><body>

<table id="fr"><tr><td>
<img src="logo.gif" height="267" width="500">
</td></tr></table>

</body></html>



... style sektionen i denne fil kan også rettes til:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title>indexslice</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="/cssfiltilforsiden.css" type="text/css">
</head><body>

<table id="fr"><tr><td>
<img src="logo.gif" height="267" width="500">
</td></tr></table>

</body></html>



og så en cssfiltilforsiden.css lagt i rod mappen med dette indhold:
html,body{margin:0px;padding:0px;height:100%;}
body{background:#e2e1dd}
#fr{border-collapse:collapse;height:100%;width:100%;}
#fr td{padding:0px;text-align:center;}
Avatar billede nicocarlos Nybegynder
27. august 2006 - 03:03 #10
Avatar billede mclemens Nybegynder
27. august 2006 - 12:57 #11
Umiddelbart ser det ud til at jeg manglede en baggrund på tabellen:
#table_01{width:801px;height:601px;border-collapse:collapse;margin:0px auto;background:#fff;}

og så skal disse billeder nok fjernes (står i toppen af siden)
<img src="images/index_02.jpg" width="108" height="87" alt="">

og

<img src="images/index_04.jpg" width="105" height="91" alt="">

... derudover så roder jeg ikke selv så meget med tabeller, men baggrunden
ser fin ud her :) - tabellen skal du nok bare lige have skubbet / rettet lidt til :/
Avatar billede nicocarlos Nybegynder
27. august 2006 - 13:07 #12
okay, http://www.alt-muligt.dk/tester/tester.html - ved ikke hvad der kan være galt
Avatar billede mclemens Nybegynder
27. august 2006 - 15:07 #13
Hmm, havde vist rørt din tabel en smule :D
... Prøv denne css fil:
html,body{height:100%;padding:0px;margin:0px;}
html{background:url('images/index_15.jpg');}
body{background:url('images/bg.jpg') repeat-x;}





og så html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><title>indexslice</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><link

rel="stylesheet" href="123_files/css.css" type="text/css"></head><body style="background:red;">

<table id="Table_01" width="801" height="601" border="0" cellpadding="0" cellspacing="0" style="margin:0px auto;">
    <tr>
        <td colspan="12">
            <img src="images/index_01.jpg" width="800" height="31" alt=""></td>
        <td>

            <img src="images/spacer.gif" width="1" height="31" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="3">
            <img src="images/index_02.jpg" width="108" height="87" alt=""></td>
        <td colspan="8" width="587" height="74">
            </td>
        <td colspan="2" rowspan="4">
            <img src="images/index_04.jpg" width="105" height="91" alt=""></td>

        <td>
            <img src="images/spacer.gif" width="1" height="74" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="5">
            <img src="images/index_05.jpg" width="76" height="82" alt=""></td>
        <td colspan="6">
            <img src="images/index_06.jpg" width="511" height="3" alt=""></td>
        <td>

            <img src="images/spacer.gif" width="1" height="3" alt=""></td>
    </tr>
    <tr>
        <td rowspan="4"><a href="index.html" target="_parent">
            <img src="images/index_07.jpg" width="135" height="79" alt="" border="0"></a></td>
        <td rowspan="4">
            <img src="images/index_08.jpg" width="1" height="79" alt=""></td>
        <td colspan="2" rowspan="4"><a href="profil.html" target="_parent">
            <img src="images/index_09.jpg" width="127" height="79" alt="" border="0"></a></td>

        <td rowspan="4"><a href="rapport.html" target="_parent">
            <img src="images/index_10.jpg" width="125" height="79" alt="" border="0"></a></td>
        <td rowspan="4"><a href="kontakt.html" target="_parent">
            <img src="images/index_11.jpg" width="123" height="79" alt="" border="0"></a></td>
        <td>
            <img src="images/spacer.gif" width="1" height="10" alt=""></td>
    </tr>
    <tr>
        <td rowspan="2">

            <img src="images/index_12.jpg" width="107" height="14" alt=""></td>
        <td rowspan="3">
            <img src="images/index_13.jpg" width="1" height="69" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="4" alt=""></td>
    </tr>
    <tr>
        <td colspan="2">
            <img src="images/index_14.jpg" width="105" height="10" alt=""></td>

        <td>
            <img src="images/spacer.gif" width="1" height="10" alt=""></td>
    </tr>
    <tr>
        <td rowspan="8">
            <img src="images/index_15.jpg" width="107" height="100%" alt=""></td>
        <td colspan="2" rowspan="5">
            <img src="images/index_16.jpg" width="105" height="100%" alt=""></td>
        <td>

            <img src="images/spacer.gif" width="1" height="55" alt=""></td>
    </tr>
    <tr>
        <td colspan="9">
            <img src="images/index_17.jpg" width="588" height="19" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="19" alt=""></td>
    </tr>
    <tr>

        <td rowspan="6">
            <img src="images/index_18.jpg" width="1" height="394" alt=""></td>
        <td colspan="5">
            <img src="images/profil_19.jpg" width="237" height="43" alt=""></td>
        <td colspan="3">
            <img src="images/profil_20.jpg" width="350" height="43" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="43" alt=""></td>
    </tr>

    <tr>
        <td>
            <img src="images/index_21.jpg" width="38" height="100%" alt=""></td>
       
      <td colspan="2" bgcolor="FFFFFF"><br>
      </td>
        <td colspan="2">
            <img src="images/index_23.jpg" width="26" height="100%" alt=""></td>
       
      <td colspan="3" rowspan="2" bgcolor="FFFFFF"><p> <br>

          <br>
          <br>
          <br>
          <br>
          <br>
          <br>
          <br>
          <br>
          <br>

        </p>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>

        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>

      </td>
        <td>
            <img src="images/spacer.gif" width="1" height="264" alt=""></td>
    </tr>
    <tr>
        <td colspan="5" rowspan="2">
            <img src="images/index_25.jpg" width="237" height="100%" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="14" alt=""></td>

    </tr>
    <tr>
        <td colspan="4" rowspan="2" width="352" height="47">
            </td>
        <td rowspan="3">
            <img src="images/index_27.jpg" width="103" height="73" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="5" alt=""></td>
    </tr>

    <tr>
        <td colspan="5">
            <img src="images/index_28.jpg" width="237" height="42" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="42" alt=""></td>
    </tr>
    <tr>
        <td colspan="9">
            <img src="images/index_29.jpg" width="589" height="26" alt=""></td>

        <td>
            <img src="images/spacer.gif" width="1" height="26" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="images/spacer.gif" width="107" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
        <td>

            <img src="images/spacer.gif" width="38" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="38" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="135" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="25" height="1" alt=""></td>

        <td>
            <img src="images/spacer.gif" width="102" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="125" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="123" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="2" height="1" alt=""></td>
        <td>

            <img src="images/spacer.gif" width="103" height="1" alt=""></td>
        <td></td>
    </tr>
</table>

</body></html>
Avatar billede mclemens Nybegynder
27. august 2006 - 15:09 #14
Hov, ret lige:
<body style="background:red;">
til: <body>
Avatar billede mclemens Nybegynder
27. august 2006 - 15:48 #15
Og så en lille piller i din tabel:
        <td>
            <img src="images/index_21.jpg" width="38" height="100%" alt=""></td>

->

        <td style="background:url('images/index_21.jpg');"></td>


samt

        <td colspan="2">
            <img src="images/index_23.jpg" width="26" height="100%" alt=""></td>

->

        <td colspan="2" style="background:url('images/index_23.jpg');"></td>
Avatar billede nicocarlos Nybegynder
27. august 2006 - 21:43 #16
http://www.alt-muligt.dk/tester/tester.html , det hjalp en del, men der er lidt problemer omkring midten med shadow også på den anden side lidt utydeligt. Jeg tror jeg skal lære at slice lidt bedre :(
Avatar billede mclemens Nybegynder
27. august 2006 - 22:12 #17
<td colspan="2" rowspan="5">
            <img src="images/index_16.jpg" width="105" height="100%" alt=""></td>

->

        <td colspan="2" rowspan="5" style="background:url('images/index_16.jpg');"></td>


...

        <td colspan="5" rowspan="2">
            <img src="images/index_25.jpg" width="237" height="100%" alt=""></td>

->

        <td colspan="5" rowspan="2" style="background:url('images/index_25.jpg') no-repeat;height:20px;"></td>


...

<td colspan="2" bgcolor="FFFFFF"><br>

->

<td colspan="2" style="background:#fff;"><br>

...
      <td colspan="3" rowspan="2" bgcolor="FFFFFF"><p> <br>

->

      <td colspan="3" rowspan="2" style="background:#fff;"><p> <br>
Avatar billede nicocarlos Nybegynder
02. september 2006 - 15:39 #18
tak for hjælpe D:
Avatar billede mclemens Nybegynder
02. september 2006 - 16:36 #19
Velbekom, og tak for point :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester