Hoe twee kleuren als achtergrond op een website te gebruiken

De achtergrondkleur van een webpagina zonder enige aanpassing is wit. Met HTML-programmeertaal kunt u de achtergrondkleur wijzigen en een achtergrondafbeelding toevoegen. U kunt een afbeelding gebruiken om een ​​achtergrond weer te geven met meerdere kleuren. Gebruik een bestaande afbeelding die de twee gewenste kleuren weergeeft, zoals die in uw bedrijfslogo, of maak een foto met een grafische editor. U kunt de tweekleurenachtergrond voor uw webpagina maken met behulp van een zich herhalende dunne horizontale afbeelding. Gebruik Cascading Style Sheets om de wijzigingen de hele site door te voeren.

1.

Open een HTML- of teksteditor om het externe stijlblad te maken dat uw CSS-achtergrondstijl behoudt.

2.

Typ een stijldefinitie voor de achtergrond in de body-tag. Stijldefinities hebben de vorm van 'tag {}', dus een definitie voor de body-tag zou 'body {}' zijn. CSS biedt verschillende parameters waarmee u uw stijl kunt definiëren. Met de eigenschap "achtergrondafbeelding" kunt u een afbeelding voor uw achtergrond opgeven. Voeg een link toe voor de afbeelding in de parameter "url". De code ziet er bijvoorbeeld als volgt uit:

body {background-image: url (images / 2colors.jpg); }

3.

Typ een waarde waarmee de achtergrond verticaal wordt herhaald - "repeat-y" - of horizontaal - "repeat-x" - met de eigenschap "background-repeat". Met deze eigenschap kunt u parameters instellen om de manier aan te passen waarop uw afbeelding zal worden herhaald. De body-stijl zal hier op lijken:

body {background-image: url (images / 2colors.jpg); background-repeat: repeat-y; }

4.

Sla het bestand op met een ".css" -extensie, bijvoorbeeld pagestyles.css.

5.

Open een webpagina waarop u de achtergrondstijl wilt toepassen. Links naar externe documenten worden ingesteld in de "" tag-set van uw webpagina. Zoek de "" -tag op en voeg de volgende tekst erboven in om toegang tot de stijlpagina te bieden:

6.

Herhaal de linkcodering op elke pagina van uw website die u de afbeeldingsachtergrond wilt gebruiken. Test het resultaat van uw wijzigingen door de pagina in een webbrowser te laden.