Achtergrond veranderen

Een achtergrond kun je op twee plekken zetten: achter je hele pagina, of achter één hokje of tabel. Het kan een kleur zijn of een plaatje dat zich herhaalt, zoals een patroon uit de galerij.

Voor je hele profiel: Profielstijl

Wil je dezelfde achtergrond op elk tabblad van je profiel, ook bij Berichten en Vrienden? Kies hem dan op Profielstijl. Daar kies je een kleur, een patroon, een achtergrond uit de galerij of een eigen plaatje, zonder code. Zie Profielstijl.

Een achtergrond in de code van een pagina geldt alleen voor die pagina, en wint daar van je Profielstijl. In de voorbeelden hieronder vult hij het voorbeeldvlak; op je profiel komt hij achter de hele pagina.

Een kleur achter je pagina

Dit kun je het makkelijkst doen met de <body>-tag van vroeger. Zet hem bovenaan je pagina, met bgcolor voor de kleur. Met text en link kies je meteen de kleur van de tekst en van de links.

<body bgcolor="#ffe3f1" text="#4a1832" link="#b0135a">
<p>Een roze pagina, met donkere letters die goed te lezen zijn.</p>
<a href="/leden">Een link</a>

Een plaatje achter je pagina

Met background zet je een plaatje achter je pagina. Het herhaalt zich vanzelf, als tegels. Kies een plaatje uit de galerij (daar staat de code al klaar), of een plaatje uit Mijn bestanden: <body background="achtergrond.gif">.

<body background="/assets/profielhulp/achtergronden/sterrennacht.png" text="#ffffff">
<p>Witte letters op een sterrenhemel.</p>

Let op de leesbaarheid. Heeft je pagina een eigen achtergrond, dan is de tekst standaard zwart en zijn links blauw, zoals vroeger. Op een donkere achtergrond kies je dus zelf lichte letters, met text of met CSS.

Herhalen en de plek kiezen met CSS

Met CSS bepaal je meer. Schrijf de regels voor body in een <style>:

• background-color: de kleur onder het plaatje. Die zie je ook zolang het plaatje nog laadt.
• background-repeat: repeat (als tegels), repeat-x (alleen naast elkaar), repeat-y (alleen onder elkaar) of no-repeat (één keer).
• background-position: waar het plaatje begint, bijvoorbeeld center top of right bottom.
• background-attachment: fixed: de achtergrond blijft staan als je scrolt.

<style>
body {
  background-color: #eaf6ec;
  background-image: url(/assets/profielhulp/lijnen/bloemetjes.png);
  background-repeat: repeat-x;
  background-position: left top;
}
</style>
<p>Een rij bloemetjes bovenaan, en daaronder lichtgroen.</p>

Een achtergrond achter een hokje

Een achtergrond kan ook achter één stuk van je pagina staan. Zet dan background in de style van een <div>, of bgcolor en background op een tabel of een cel, zoals toen. Geef het hokje wat padding, zodat de tekst niet tegen de rand plakt.

<div style="background: #fff0f3 url(/assets/profielhulp/achtergronden/hartjes.png); padding: 16px; color: #4a1832">
  <b>Over mij</b><br>
  Dit hokje heeft hartjes als achtergrond.
</div>
<br>
<table cellpadding="10">
  <tr>
    <td bgcolor="#1d2345"><font color="#ffffff">Een donkere cel</font></td>
    <td background="/assets/profielhulp/strak/achtergronden/ruitpapier-blauw.svg">Een cel met ruitjes</td>
  </tr>
</table>

Andere sites en bewegende plaatjes

Een plaatje van een andere site als achtergrond haalt de site weg. Zet het eerst in Mijn bestanden met Binnenhalen, en gebruik dan de naam. Een bewegende achtergrond mag. Zet je hem op <body> of in een <style>, dan staat hij stil bij bezoekers die minder beweging willen. Achter een hokje of cel met een style- of background-attribuut blijft hij wel bewegen; kies daar liever een stilstaand plaatje.