# Kā pielāgot HTML fonus ar krāsām vai attēliem HTML fonus var izveidot, izmantojot krāsu vērtības vai attēlu failu. Pareiza fona izvēle var uzlabot jūsu tīmekļa vietnes dizainu, vienlaikus nodrošinot, ka saturs paliek skaidrs un viegli lasāms. ## Kas ir HTML foni? Tīmekļa lapas **satura fons** tiek saukts par HTML fonu. Šos fonus var iestatīt, veidojot lapu HTML. Tos var arī vēlāk mainīt atbilstoši vajadzībām. Pēc noklusējuma HTML foni ir balti. To maiņa ir ieteicama ne tikai kā veids, kā uzlabot tīmekļa vietnes dizainu, bet arī kā veids, kā uzlabot satura redzamību. ## Kā var mainīt HTML fonu? Ir divi galvenie veidi, kā izveidot HTML fonus: - **piemērojot krāsu vērtību** - **izmantojot attēlu vai gradientu** Šīs vērtības tiek iestatītas ar HTML atribūtu `style`. Nākamajās sadaļās mēs izskaidrosim abas metodes. Tip Vairāk par HTML stila tagu iespējām varat uzzināt mūsu rakstā par šo tēmu. ### HTML fona definēšana pēc krāsas vērtības Lai mainītu HTML fona krāsu, izmantojiet `style` atribūtu un `background-color` vai `bgcolor` īpašību. **Krāsas vērtības** norādīšanai ir trīs dažādas iespējas: - **Krāsas nosaukums**: Jums ir iespēja iestatīt vēlamo krāsu, vienkārši izmantojot tās nosaukumu. Papildus standarta krāsām, piemēram, `red`, `yellow` vai `green`, ir pieejamas arī īpašas krāsas, piemēram, `lightblue` vai `deepskyblue`. Krāsu norādot, nav svarīgi, vai tiek izmantoti lielie vai mazie burti. - **Heksadecimālais krāsu kods**: Jūs varat norādīt krāsas, izmantojot to sešu ciparu heksadecimālo numuru. Tas sastāv no trim pāriem, kas veidoti no cipariem `0` līdz `9` un burtiem `a` līdz `f`. Pirmais pāris attēlo sarkano vērtību, otrais attēlo zaļo, bet trešais attēlo zilo, kur 00 ir zemākā vērtība un ff ir augstākā. Piemēram, zils būtu `0000ff`. - **RGB vērtība**: Alternatīvi varat izmantot RGB vērtību, kas ir arī sešzīmju krāsu koda pamatā. Vērtības ir no `0` līdz `255` un atbilst krāsām sarkana, zaļa un zila. Piemēram, zila krāsa būtu RGB (0, 0, 255). Sintakse, ko izmantojat, lai definētu vēlamo krāsu HTML fonam, izskatās šādi: ```html ``` Šajā piemērā mēs izmantojam heksadecimālo krāsu kodu, lai norādītu gaiši zilu kā fona krāsu: ```html background-example

Here’s your heading

Here’s your website content.

``` Tas izskatās šādi: [![Image: HMTL background: Colour example](https://www.ionos.com/lv-lv/digitalguide/fileadmin/_processed_/1/5/csm_html-color-background-example_fa19e51324.webp "HMTL background: Colour example")](https://www.ionos.com/lv-lv/digitalguide/fileadmin/DigitalGuide/Screenshots_2024/html-color-background-example.png) Sample HTML background with the hex code ‘#BFEFFF’. Ja nepieciešams, varat arī atsevišķi definēt krāsas HTML fonam atsevišķām jūsu tīmekļa lapu sadaļām. To var izdarīt, izmantojot `style` atribūtu un `background-color` īpašību. Jūs varat redzēt, kā tas darbojas, šajā piemērā, kur dažādas krāsas ir iestatītas visam fonam, kā arī `

` virsrakstu un `

` teksta sadaļu fonam: ```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/lv-lv/digitalguide/fileadmin/_processed_/b/1/csm_html-background-example-2_a5a13bd28c.webp "Example: Three different coloured HTML backgrounds")](https://www.ionos.com/lv-lv/digitalguide/fileadmin/DigitalGuide/Screenshots_2024/html-background-example-2.png) Example of an HTML background with three different colours. ### Attēlu iestatīšana kā HTML fonu Lai attēlus vai grafikas varētu izmantot kā HTML fonu, tie jāglabā *JPG*, *PNG*, *SVG*, *WebP* vai *GIF* attēlu formātos. Turpmākajā piemērā parādīts atbilstošais kods attēla integrēšanai kā fonu. Attēla ceļš jāpielāgo individuāli: ```html background-example

Here’s your heading

Here’s your website content.

``` Izmantojot attēlu, vienmēr jāpatur prātā satura salasāmība. Norādot papildu parametrus, varat pielāgot attēla vai grafika **novietojumu**, lai teksts būtu atšķirams no fona. This is a markdown version of: [https://www.ionos.com/lv-lv/digitalguide/timekla-vietnes/timekla-izstrade/html-foni/](https://www.ionos.com/lv-lv/digitalguide/timekla-vietnes/timekla-izstrade/html-foni/) for AI/LLM consumption.