Deze pagina is bijgewerkt op 20 oktober 2020
Ben je een website aan het maken? Dan is de achtergrond van je website erg belangrijk. Om de achtergrond van de website en kleur te geven moet je meestal de body tag gebruiken. Hieronder is een voorbeeld van een CSS code die je kunt gebruiken:
body { background-color: #ffff96; }
Deze code moet in de style.css toegevoegd worden. Ben je op zoek naar de juiste kleurcode? Bekijk dan deze pagina: Kleurcodes.
Achtergrondfoto in plaats van achtergrondkleur website
In plaats van een kleur kun je ook kiezen voor een achtergrondafbeelding. Met een achtergrondafbeelding kun je meteen een heel andere sfeer aan de website mee geven.
Een achtergrond foto plaats je op deze manier:
body { background-image: url('https://cdn.pixabay.com/photo/2018/06/28/17/02/water-lily-3504363_960_720.jpg'); }
Er zijn nog meer stijlen die je kunt gebruiken voor de achtergrond foto. Zo kun je aangeven dat hij niet herhaalt, zich verspreid over het hele scherm of vast komt te staan:
body { background-image: url('https://cdn.pixabay.com/photo/2018/06/28/17/02/water-lily-3504363_960_720.jpg'); background-repeat: no-repeat; background-size: cover; background-attachment: fixed; }
Ojaa en dit is trouwens een goede website voor mooie gratis foto’s: Pixabay
Andere vragen over de achtergrondkleur website?
Kom je er nog niet helemaal uit of heb je nog andere vragen? Laat hieronder dan een reactie achter en dan help ik je snel verder :)!
Hallo!
het lukt mij niet om de achtergrondkleur van een pagina in WordPress te wijzigen. Ik raak verdwaald in CCS codes en zo.
Zou je mij kunnen helpen?
Gerrit
Hoi Gerrit,
Ik kan me voorstellen dat je verdwaald kan raken in de CSS code. Kun je mij de inlog van de website sturen zodat ik even kan kijken? Of even een apart account voor me aanmaken? Als je wel weet waar je de CSS codes kan toevoegen dan kan ik je makkelijk even de code sturen die je nodig hebt om de achtergrondkleur te veranderen. Je kunt de gegevens sturen naar info@website-advies-bureau.nl
Groetjes
Thamar
http://www.taartjesvantootje.com
Ik weet niet precies waar ik de code moet plaatsen. Is het mogelijk om dit deel van de code een kleur te geven, opdat ik het terug kan vinden?
Gerrit
Ik heb even voor je gekeken, maar voor jouw website is het wel iets ingewikkelder. Je werkt met Elementor en een uitgebreide template wat het wijzigingen van een achtergrondkleur moeilijker kan maken. Via Weergave > Customizer > Extra CSS (helemaal onderin) heb ik een paar kleine CSS codes toegevoegd die ervoor zorgen dat je nu een andere achtergrondkleur hebt 🙂
Succes met het maken van je website! En mocht je nog andere vragen hebben stel ze gerust.
Groetjes Thamar
Ik heb mijn footer ook voorzien van een achtergrond kleur, echter loopt deze op een aantal pagina’s niet volledig door over de gehele scherm, terwijl hij bij de andere pagina’s wel volledig doorloopt over de gehele scherm.
Ik vind dit heel lelijk uitzien, wat doe ik eventueel fout?
Hoi Sezgin, dat klinkt inderdaad niet mooi! Kan je mij de URL van de website sturen? Dan zal ik even met je mee kijken :)!