# Kuidas kohandada HTML-taustu värvide või piltidega HTML-taustu saab luua värvi väärtuste või pildifailiga. Õige tausta valik võib parandada veebisaidi kujundust, tagades samal ajal, et sisu jääb selgeks ja kergesti loetavaks. ## Mis on HTML-taustad? Veebilehe **sisu taga olevat ala** nimetatakse HTML-taustaks. Need taustad saab määrata HTML-lehe loomisel. Neid saab vajaduse korral ka hiljem muuta. Vaikimisi on HTML-taustad valged. Selle muutmine on soovitatav mitte ainult veebilehe kujunduse parandamiseks, vaid ka sisu nähtavuse parandamiseks. ## Kuidas saab muuta HTML-taustat? HTML-taustade kujundamiseks on kaks peamist viisi: - **värvi väärtuse rakendamisega** - **kasutades pilti või gradienti** Need väärtused määratakse HTML-atribuutiga `style`. Järgmistes jaotistes tutvustame mõlemat meetodit. Tip HTML-stiilimärgise võimaluste kohta saate lisateavet meie selle teema kohta kirjutatud artiklist. ### HTML-taustade määratlemine värvi väärtuse järgi HTML-tausta värvi muutmiseks kasuta atribuuti `style` ja omadust `background-color` või `bgcolor`. **Värvi väärtuse** määramiseks on kolm erinevat võimalust: - **Värvi nimi**: Teil on võimalus määrata soovitud värv lihtsalt selle nime abil. Lisaks standardvärvidele, nagu `red`, `yellow` või `green`, on võimalikud ka erivärvid, nagu `lightblue` või `deepskyblue`. Värvi määramisel ei ole tähtede suurus oluline. - **Hex-värvikood**: Värve saab määrata ka kuuekohalise kuueteistkümnendkoodiga. See koosneb kolmest paarist, mis koosnevad numbritest `9` ja tähtedest `f`. Esimene paar tähistab punast väärtust, teine rohelist ja kolmas sinist, kus 00 on madalaim väärtus ja ff kõrgeim. Näiteks sinine oleks `0000ff`. - **RGB-väärtus**: Alternatiivina võite kasutada RGB-väärtust, mis on ka kuueteistkümnendkoodi aluseks. Väärtused ulatuvad `0` `255` ja vastavad värvidele punane, roheline ja sinine. Näiteks sinine oleks RGB (0, 0, 255). HTML-taustade soovitud värvi määramiseks kasutatav süntaks näeb välja järgmine: ```html ``` Järgmises näites kasutame heksadesimaalset värvikoodi, et määrata taustavärviks helesinine: ```html background-example

Here’s your heading

Here’s your website content.

``` See näeb välja selline: [![Image: HMTL background: Colour example](https://www.ionos.com/et-ee/digitalguide/fileadmin/_processed_/1/5/csm_html-color-background-example_fa19e51324.webp "HMTL background: Colour example")](https://www.ionos.com/et-ee/digitalguide/fileadmin/DigitalGuide/Screenshots_2024/html-color-background-example.png) Sample HTML background with the hex code ‘#BFEFFF’. Vajaduse korral saate HTML-taustade värvid määratleda ka eraldi veebilehe üksikute osade jaoks. Selleks kasutatakse atribuuti `style` ja omadust `background-color`. Kuidas see toimib, näete järgmisest näidisest, kus on määratud erinevad värvid nii kogu taustale kui ka `

` pealkirja ja `

` tekstiosa taustale: ```html background-example

The background of this headline is set to DodgerBlue.

This background is set to DarkTurquoise.

``` [![Image: Example: Three different coloured HTML backgrounds](https://www.ionos.com/et-ee/digitalguide/fileadmin/_processed_/b/1/csm_html-background-example-2_a5a13bd28c.webp "Example: Three different coloured HTML backgrounds")](https://www.ionos.com/et-ee/digitalguide/fileadmin/DigitalGuide/Screenshots_2024/html-background-example-2.png) Example of an HTML background with three different colours. ### Piltide seadmine HTML-taustadena Et pilte või graafikat saaks kasutada HTML-taustadena, peavad need olema salvestatud *JPG-*, *PNG-*, *SVG-*, *WebP-* või GIF-pildiformaadis. Järgmine näide näitab sobivat koodi pildi taustana integreerimiseks. Pildi asukoha tee tuleb kohandada individuaalselt: ```html background-example

Here’s your heading

Here’s your website content.

``` Pildi kasutamisel tuleb alati silmas pidada sisu loetavust. Lisaparameetrite määramisega saate kohandada pildi või graafiku **paigutust**, et tekst oleks taustast eristatav. This is a markdown version of: [https://www.ionos.com/et-ee/digitalguide/veebisaidid/veebiarendus/html-taustad/](https://www.ionos.com/et-ee/digitalguide/veebisaidid/veebiarendus/html-taustad/) for AI/LLM consumption.