Webmasterka

Jest to kolejny artykuł z serii “css dla początkujących”. Tym razem pokażę jak zmienić kolor tła oraz jak wstawić powtarzające się tło (obrazek) na stronie. Aby wszystko w pełni funkcjonowało nie zapomnijmy o osadzeniu pliku style.css

1. Zmiana koloru tła strony. Wybieramy sobie dany kolor w postaci #HEX. Do tego celu możemy zajrzeć do poniższego linku:

• Zbuntowane kolory web 2.0

plik style.css

html, body {
background-color: #000000; /* czarny kolor tła */
}

…………………………… . . . . .

2. Powtarzające się tło

plik style.css

html, body {
background-image:url(tlo.jpg); /* podajemy ścieżkę do tła */
background-repeat:repeat; /* ustawiamy powtarzanie */
}

Inne opcje:

• reapeat-x; powtarzanie poziomo
• repeat-y; powtarzanie pionowo
• no-repeat; bez powtarzania

Weboholic: znajdziemy tutaj ciekawe tła

…………………………… . . . . .

3. Dwa tła na stronie

plik index.html

<div id="box1“></div>
<div id=”box2“></div>

plik style.css

#box1 {
background-image:url(tlo.jpg);
background-repeat:repeat;
width:100px;
height:300px;
}
#box2 {
background-image:url(tlo2.jpg);
background-repeat:repeat;
width:200px;
height:100px;
}

Podgląd