Balk van links naar rechts

Gestart doorReins15 reacties27 weergaven

16 berichten · pagina 1 van 2

Reins

Lid · Topicstarter

Berichten
14.363
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Hoi,
hoe kan ik een image van linksboven naar rechtsboven laten lopen?
De balk moet dus meteen grenzen aan de bovenkant van je browser en aan de linker en rechterkant.
Alvast bedankt biggrin
0
Berichten
15.446
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
is het een egale balk van kleur of bestaat die balk uit een afbeelding die niet herhaald mag worden?

indien het een simpel balkje is die je kan laten herhalen dan zet je dit in je css:

body {width:100%; margin:0; background: url(afbeelding.ext) repeat-x;}


de afbeelding is dan een smal stukje bv 1px breed van je balk.
0
Reins

Lid · Topicstarter

Berichten
14.363
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Bedankt Marjolein, maar wat nou als ik al een achtergrond heb in mijn body?
0
Berichten
9.953
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Dan maak je een aparte div, en zet je die boven neer.
0
Reins

Lid · Topicstarter

Berichten
14.363
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Kijk,
ik wil een achtergrond en daarover heen zon balk.
Ik dacht dat het dan zo moest, maar dat is ook al niet het geval..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>OSX Lion</title>
<style>
body {
    background-image:url(http://www.gozzinet.net/wp-content/mac_osx_snow_leopard_wallpaper_by_envoyzero.jpg);
}

</style>
</head>

<body>
<img src="http://i56.tinypic.com/2jdq7w7.png" style="margin:0; background-repeat: repeat-x;" />
</body>
</html>


Dan krijg je dit, i70.nl/macosx
0
Berichten
93.699
Reputatie
0
Punten
1,27
Lid sinds
Laatst gezien
Body:
margin: 0px;
De img: width: 100%; (& height)
0
Berichten
5.795
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>OSX Lion</title>
<style>
body {
    background-image:url(http://www.gozzinet.net/wp-content/mac_osx_snow_leopard_wallpaper_by_envoyzero.jpg);
margin:0;
}
</style>
</head>

<body>
<img src="http://i56.tinypic.com/2jdq7w7.png" style="background-repeat: repeat-y; width:100%; height:27px;">


</body></html>
0
Rik

Lid

Berichten
18.393
Reputatie
0
Punten
0,04
Lid sinds
Laatst gezien
Ik zou het eigenlijk zo doen:

ik neem namelijk aan dat je in die balk ook nog andere dingen wilt zetten:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>OSX Lion</title>
<style>
body {
    background-image:url(http://www.gozzinet.net/wp-content/mac_osx_snow_leopard_wallpaper_by_envoyzero.jpg); margin:0;
}

</style>
</head>

<body>
<div style="margin: 0; padding: 0; background: url(http://i56.tinypic.com/2jdq7w7.png) repeat-x; height: 27px;">Een balk vol met tekst. Dit is echt geweldig.</div>
</body>
</html>


of uiteraard de inline style in de head zetten tussen de style tags.
0
Berichten
15.446
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
je heb nu dit:
Spoiler tonen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>OSX Lion</title>
<style>
body {
    background-image:url(http://www.gozzinet.net/wp-content/mac_osx_snow_leopard_wallpaper_by_envoyzero.jpg);
}

head {
body {width:100%; margin:0; background-image: url(file:///C|/Users/Reinier/Documents/Socialfun/head.png) repeat-x;}
</style>
</head>

<body>
<img src="http://i56.tinypic.com/2jdq7w7.png" style="margin:0; background-repeat: repeat-y;" />
</body>
</html>
verander dat in:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>OSX Lion</title>
<style>
body {
    width: 100%;
    margin:0;
    background-image:url(http://www.gozzinet.net/wp-content/mac_osx_snow_leopard_wallpaper_by_envoyzero.jpg);
}

#balk {
   background: url (http://i56.tinypic.com/2jdq7w7.png) repeat-x; 
   margin:0;
   width: 100%;
   height: 27px;
}
</style>
</head>

<body>
<div id="balk"></div>
</body>
</html>
0
Reins

Lid · Topicstarter

Berichten
14.363
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Even proberen zometeen, alleen DirectAdmin ligt eruit..

toevoeging op 4 september 2011, 15:46:40:
Die van Rik werkt perfect, die van jou helaas niet Marjolein redfaceBedankt!! biggrin
0
Rik

Lid

Berichten
18.393
Reputatie
0
Punten
0,04
Lid sinds
Laatst gezien
Reinier schreef:
Even proberen zometeen, alleen DirectAdmin ligt eruit..
toevoeging op 4 september 2011, 15:46:40:
Die van Rik werkt perfect, die van jou helaas niet Marjolein redfaceBedankt!! biggrin
Die van marjolein is wel beter, maar ze heeft bij #balk "url (" in plaats van "url(". Als je dat even veranderd bij die van marjolein is het eigenlijk beter wink
0
Reins

Lid · Topicstarter

Berichten
14.363
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Hoezo is die dan beter? Omdat de style in css staat?
Ik probeer wat te leren snapje yummie
0
Rik

Lid

Berichten
18.393
Reputatie
0
Punten
0,04
Lid sinds
Laatst gezien
Reinier schreef:
Hoezo is die dan beter? Omdat de style in css staat?
Ik probeer wat te leren snapje yummie
Jep. Inderdaad omdat de style in de CSS staat.
0
Reins

Lid · Topicstarter

Berichten
14.363
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
En als ik die van jou gebruik, heeft dat dan nadelen ivm verschillende browsers enzo?
0
Rik

Lid

Berichten
18.393
Reputatie
0
Punten
0,04
Lid sinds
Laatst gezien
Reinier schreef:
En als ik die van jou gebruik, heeft dat dan nadelen ivm verschillende browsers enzo?
Opzich niet. Maar het is gewoon slechter. Als je iets wil aanpassen aan de style dan moet je dat inline gaan veranderen wat gewoon ontzettend onhandig is. Je hebt liever alle opmaak en alle code appart.
0

Jouw reactie

Deel je idee, stel een vraag of help een ander verder.

Editor laden…

Praat mee met de One2xs-community.

Inloggen om te reageren