achtergrond instellen voor menu pagina.

djeric · 1 dec 2006

hellllllllllllllllllllllp!

ik zit met een probleem.

ik heb een achtergrond die bestaat uit 2 delen.

een plank zie :

http://www.helpmij.nl/forum/attachment.php?attachmentid=37097&stc=1&d=1164987854

en een dak zie:

http://www.helpmij.nl/forum/attachment.php?attachmentid=37098&stc=1&d=1164988018

maar ik krijg het niet goed ingesteld als een achtegrond voor me webpagina.
het mag niet herhalen zoals nu gebeurd en de plank moet zeg maar aan het dak komen en dan herhalen naar onderen zovernodig...

hoe schrijf je zo code met geen herhaling op de pagina???

nu is het namelijk zo op mijn site:

http://www.skihutinfo.nl

ik wil eigenlijk zoiets hebben als:

http://www.skihutheerlen.nl

maar wat ik ook probeer het plaatje word weer verkeerd weergegeven.

het moet door de meeste browsers goed worden weergegeven en ook met verschillende scherm resoluties.

iemand sugeties???

Johantrax · 1 dec 2006

ik heb hun code eens bekeken en zij maken gebruik van div's. een eerste met je dak in en dan een andere met de plank als achtergrond.

uit hun stylesheet, de opmaak van de 2de div:

Code:

#contentdiv {
    width: 720px;
    height: auto;
    float: left;
    padding-left: 35px;
    padding-right: 35px;
    background-image: url('hut.jpg'); //de afbeelding
    background-repeat: repeat-y;  //enkel verticaal herhalen
    background-position-x: center; //horizontaal centreren
    text-align:left;
}
//hetzelfde effect maar dan voor IE
* html #contentdiv {
    width: 740px;
    height: auto;
    min-height: 600px;
    float:left;
    padding-left: 35px;
    padding-right: 35px;
    background-image: url('hut.jpg');
    background-repeat: repeat-y;
    background-position-x: center;
    text-align:left;
}

--Johan

djeric · 1 dec 2006

re:antwoord

Ik heb al zoveel gelezen over dit soort code's maar hoe beschrijf je het in je html?

als ik dat zou copieren wat je schrijft en dat dan dus tussen de <body> </body>
tags zet dan heb ik als resultaat helemaal niets

ik snap niet goed hoe je moet beginnen.

Johantrax · 2 dec 2006

het geen zij gebruiken zijn stylesheets, opgemaakt in de taal css. Een nederlandstalige lessensite met duidelijke voorbeelden kan je vinden op http://www.handleidinghtml.nl

Als je wil probeer ik tegen volgend weekend anders een volledig voorbeeld van jouw probleem te maken.

--Johan

djeric · 2 dec 2006

Johantrax zei:
Als je wil probeer ik tegen volgend weekend anders een volledig voorbeeld van jouw probleem te maken.

--Johan

dat zou zeer aardig zijn!!!!!!:thumb: ik heb al een gedeelte door.

het eerste achtergrond gedeelte lukt me vrij goed.

maar kan geen 2e maken

dit heb ik nu tussen staan.

<body>

<STYLE TYPE="text/css">

</STYLE>

</body>

maar dan merkte ik al op dat de overige achtergrond super kaal is... is deze ook nog op te vullen?

djeric · 6 dec 2006

nog te moeilijk voor dubbele achtergond plaatje

ik vind het nog steeds een moeilijke uitleg....

had ik maar een html zodat ik verschillende achtegronden kon combineren.

ik heb al veel gelezen en help gebruikt maar kom niet verder dan 1 achtergrond plaatje of achtegrond plaatje met kleur.

de bedoeling is eigenlijk 2 plaatjes te combineren met elkaar.

een stuk dak van een skihut

en dan de hut langer laten maken als een message board: dit word opgevult met planken. die dus aangesloten worden met het dak.

alleen zijn dit 2 plaatjes. dus 2x een achtergrond

het overige deel van het scherm zal dan wit moeten zijn en moet als oplossing als het kan een bewegende achtergrond plaatje erop hebben,

is dit mogelijik???

en als iemand het kan uitleggen kan je heel ff duidelijk bij vertellen hoe ik iets verander en wat je dan moet veranderen. en hoe je het precies plaatst op de website.

ik heb veel gelezne over deze tekens { } maar als ik bv iets kopier wat iemand schrijft bak ik er niks van

iemand met duidelijk html kennis??????

DutchDisturbed · 8 dec 2006

haha duidelijke html kennis.. ik begrijp niet wat je nu precies wil maar hier iig iets wat kan helpen.
je moet iig dus dat huisje als achtergrond maken (dat was gelukt).
daarna moet je door een div (<div></div>) er een plaatje overheen zetten

<STYLE TYPE="text/css">

</STYLE>

dit moet je denk ik in je head zetten...

ik heb zelf een bestandje als opmaak.css waar dit in staat

Code:

BODY { background-image: url(plaatje.gif); 
background-repeat: no-repeat; 
background-position: top; 
background-attachment: scroll; }

voorbeeld -> www.pollutionmusic.nl/polluted.css

in je head moet je dan een link naar dat bestand plaatsen:
<link href="design2.css" type="text/css" rel=StyleSheet>

je leest hier meer over bij de handleiding die eerder is genoemd.

nu verder met het plaatje. je moet een vak maken die dus die plank als achtergrond heeft. dit doe je door met div een vak te maken en een naam te geven. in de stijlcode geef je dan aan dat de plank als achtergrond moet, op dezelfde manier als voor de body.
als je het vak een naam geeft moet je bij de css code beginnen met een # dus als je het vak plank noemt krijg je #plank { css code zelfde als bij body }
je kan dan met width: 500px; height: 50px; aangeven hoe groot het vak met achtergrond moet. en via position: absolute; top: 100px; left: 100px; kan je regelen waar ie geplaatst wordt.
resultaat:

Code:

<head>
<STYLE TYPE="text/css">
<!--
BODY { background-image: url(plaatje.gif); 
background-repeat: no-repeat; 
background-position: top; 
background-attachment: scroll; }

#plank { background-image: url(plank.gif);
background-repeat: no-repeat; 
background-position: top; 
background-attachment: scroll; 
width: 500px; 
height: 50px;
position: absolute; 
top: 100px; 
left: 100px;
}

-->
</STYLE>
</head>
<body>
<div id="plank"></div>
</body>

geluk!

djeric · 8 dec 2006

achtegrond word verkeerd weergegeven in andere schermresolutie.

wat is hier de fout dan in de code?
het plaatje plank.gif staat niet helemaal goed op de juiste plaats. en verandert ook als je de schermresolutie aanpas.

<html>

<head>
<STYLE TYPE="text/css">

</STYLE>
</head>

<body>
<div id="plank"></div>
</body>
</html>

DutchDisturbed · 8 dec 2006

hmm dat komt doordat je aangeeft dat ie een bepaalde afstand vanaf de boven en linkerkant staat. dus als je de resolutie aanpast lijkt het dat ie van plaats veranderd omdat de afstand van 100 pixels meer ruimte inneemt... (het plaatje wordt ook groter...)
je zal met waardes moeten *****n om m op de juiste plaats te krijgen..
trouwens left: center; is fout
de waarde center doet daar niets, je zal met pixels of procenten moeten werken.
je kan ook met position: relative; werken
dan moet je de plaats bepalen van het vak ten opzichte van waar hij komt te staan zonder de stijl code.
verder aanklooien en dan moet het lukken en hou de handleidingen in de gaten

djeric · 14 okt 2009

weer terug van weg geweest.

ik was met me website bezig toen me hd kapot ging.

ik ben dus o.a. bestanden kwijt geraakt dat ik dacht,,,,,

ach begin opnieuw.

tijdje iets anders gemaakt en nu werderom deze topic opnieuw gelezen.

ben toch hiermee verder gegaan.

ik heb mijn html code aangepast en ziet er verders goed uit (uit test op mijn pc met scherm resolutie 1024 x 768)

mijn code:

<head>
<STYLE TYPE="text/css">

</STYLE>
</head>

<body>
<div id="plank"></div>
</body>
</html>

is dit juist?????

mijn 2 plaatjes worden nu toch netjes onderelkaar geplaatst???

of is deze code onjuist? doordat bv firefox, het niet goed weergeeft???

wat moet ik aanpssen?

achtergrond instellen voor menu pagina.

djeric

Gebruiker

Bijlagen

Johantrax

Terugkerende gebruiker

djeric

Gebruiker

Johantrax

Terugkerende gebruiker

djeric

Gebruiker

djeric

Gebruiker

DutchDisturbed

Gebruiker

djeric

Gebruiker

DutchDisturbed

Gebruiker

djeric

Gebruiker

Nieuwste berichten

Wij waarderen jouw privacy