Achtergrond word niet weergeven.
Dit is mijn eerste echte werkje in CSS dus verwacht er maar niet heel veel van.
Ik heb deze code
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
p {
color: Red;
}
body {
background-image: http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg;
}
Nu als ik mijn pagina open zie ik alleen de rode tekst en niet de achtergrond afbeelding.
Koen Hollander
color: Red;
}
body {
background-image: http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg;
}
Nu als ik mijn pagina open zie ik alleen de rode tekst en niet de achtergrond afbeelding.
Koen Hollander
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
p {
color: Red;
}
body {
background-image: url('http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg');
}
color: Red;
}
body {
background-image: url('http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg');
}
Ik heb nu deze code:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
p {
color: Red;
}
body {
background-image: url('http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg');
}
#background {
width: 100%;
height: 100%;
}
color: Red;
}
body {
background-image: url('http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg');
}
#background {
width: 100%;
height: 100%;
}
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
p {
color: Red;
}
body {
background-image: url('http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#background {
width: 100%;
height: 100%;
}
color: Red;
}
body {
background-image: url('http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#background {
width: 100%;
height: 100%;
}
Gewijzigd op 30/09/2012 13:27:30 door Koen Vlaswinkel
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
p {
color: Red;
}
body {
background-image: url('http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg');
background-repeat: no-repeat; /* Zorgt ervoor dat de achtergrond niet herhaalt word */
background-position: cencter center; /* Zorgt ervoor dat de achtergrond altijd in het midden blijft, dit is aan jou om dit te laten of weg te halen */
}
#background {
width: 100%;
height: 100%;
}
color: Red;
}
body {
background-image: url('http://nl.dreamstime.com/het-teken-van-de-fout-thumb15393072.jpg');
background-repeat: no-repeat; /* Zorgt ervoor dat de achtergrond niet herhaalt word */
background-position: cencter center; /* Zorgt ervoor dat de achtergrond altijd in het midden blijft, dit is aan jou om dit te laten of weg te halen */
}
#background {
width: 100%;
height: 100%;
}
En om het dan nog mooi te maken door je achtergrond in het midden van de pagina te zetten kan je background-position: center center; doen zodat de achtergrond altijd in het midden komt.
Gewijzigd op 30/09/2012 13:51:49 door Machiel K