HodTari.com

Indstilling af baggrundsfarver i HTML

At have prangende farver nederst på skærmen kan hjælpe dig med at tiltrække flere læsere til din side. Der er flere muligheder for dem, der ønsker at bruge mere end solide farver. For at konfigurere dem bruger vi CSS-sproget i stedet for de forældede HTML-tags. Dette gør hjemmesiden kompatibel med de fleste browsere og kan nemt opdateres, når nye funktioner er tilgængelige.

trin

Metode 1
Baggrund med solide farver

Billede titel 2609629 1
1
Brug CSS`en "baggrundsfarve" egenskaben. Den gamle attribut HTML understøttes ikke længere af HTML5. Baggrundsfarven, samt andre stilistiske aspekter af siden, skal konfigureres med CSS.
  • Billede titel 2609629 2
    2
    Tilføj baggrundsfarveegenskab til element . Dette element vises på hele siden.

  • Video: New Audi Q3 S line 2019 - first quick look in 4K

    Billede titel 2609629 3
    3
    Tilføj den farve, du vil vise. Der er tre måder at gøre dette på: Indtast hovedfarverne (rød, blå, gul, grøn osv.) Med koderne rød, blå, gul, grøn (på engelsk) osv. - brug hexadecimale koder for farve, som # 000000 til sort - eller indtast RGB-værdien af ​​farven, som rgb (255,255,0) til gul. Nedenfor er et eksempel på hexadecimal kode i brug - hvilket vil give baggrunden for webstedet den samme farve som wikiHow-fronten.
    • Rød - # FF0000
    • Orange - # FFA500
    • Gul - # FFFF00
    • Grøn - # 008000
    • Blå - # 0000FF
    • Anil - # 4B0082
    • Lilla - # EE82EE
  • Billede titel 2609629 4
    4
    Brug baggrundsfarveegenskaben til at anvende baggrundsfarverne til andre elementer. Du er ikke begrænset til at gøre dette kun i elementet . Hvis du vil, kan du også opsætte det andetsteds:
    Denne overskrift vil have en orange baggrund
    Dette afsnit vil have en rød baggrund

    • Metode 2
    Baggrund med mutante farver

    Video: Hvidbalance - Hvad hvidbalance betyder på dit kamera

    Billede titel 2609629 5
    1
    Tilføj overgangskoden. Du kan oprette en animeret baggrund ved at have dine toner ændret med jævne mellemrum. Denne funktion understøttes ikke af ældre browsere, især Internet Explorer (medmindre den har version 10 eller højere). Derudover skal du inkludere to sæt animationskoder, da Chrome, Opera og Safari bruger forskellige syntakser over IE, Firefox og andre browsere.
    • Værdien 20`erne ovenfor kan justeres i henhold til farveovergangstiden. 20`erne betyder at denne overgang vil tage 20 sekunder. Hvis du vil ændre det, skal du ændre både webkit og standard syntaks.
    • Værdien uendelig kan ændres for at gentage bestemte tidspunkter. Koden baggrundsfarve: # C9DCB9- i elementet angiver den farve, der vil blive vist efter animationen.
  • Billede titel 2609629 6
    2
    Tilføj den farvekode, du vil give til siden under overgangen. Efter kodning af animationen skal du indstille den farvekode, du vil bruge i mellemtiden. Igen: generer forskellige poster for forskellige browsere.

    • Metode 3
    Baggrund med billeder

    1. 1


      Brug et billede som baggrund for siden. Vælg en fil, der er gemt på internetserveren - den skal gemmes ved siden af ​​selve webstedets fil.
    2. 2
      Brug flere lagede billeder. Filerne kan lægges på hinanden. Denne strategi er nyttig, hvis du har gennemsigtige baggrunde, der supplerer hinanden, når "stablet".
      • Det første billede, der vises, vises øverst i stakken. Den anden kommer snart efter.

    Metode 4
    Gradient baggrund

    Billede titel 2609629 7
    1
    Brug CSS til at oprette en gradient baggrund, der går fra en farve til en anden. Denne funktion understøttes ikke af Internet Explorer 9 eller ældre versioner.

  • Video: DEMO af Musikstyret RGB LED Bånd

    Billede titel 2609629 8
    2
    Forstå grundlæggende syntaks. Der er to væsentlige oplysninger med hensyn til at skabe en gradient baggrund: startpunktet / vinklen af ​​effekten og overgangsfarverne. Du kan vælge og bruge flere toner eller indstille en bestemt retning eller vinkel for effekten.
    baggrund: lineær gradient (retning / vinkel, farve1, farve2, farve3 osv.)
  • Billede titel 2609629 9
    3
    Lav en vertikal gradienteffekt. Hvis du ikke angiver retningen, vil effekten rulle op og ned. Forskellige webbrowsere udfører denne funktion på forskellige måder - så omfatter flere versioner af den for at sikre, at den kan afspilles på flere af dem.
  • Billede med titlen 2609629 10
    4
    Gør en retningsgradient effekt. Ved at tilføje en retning til effekten kan du ændre farveovergangen. Forskellige browsere fortolker denne ændring på forskellige måder. Men alle vil have samme effekt.
  • Billede med titlen 2609629 11
    5
    Brug andre egenskaber til at justere gradienteffekten. Der er mange andre muligheder for at ændre det.
    • For eksempel: Ud over at tilføje mere end to farver kan du ændre procentdelen af ​​hver ved at konfigurere hvor meget plads hvert segment har på skærmen.
      baggrund: lineær gradient (# 93B874 10%, # C9DCB9 70%, # 000000 90%) -
    • Hvis du kan lide, kan du også tilføje gennemsigtighed på skærmen. Farven bliver således mere og mere falmet. Vælg en enkelt tone, så den falder, indtil den forsvinder. For at konfigurere disse indstillinger skal du bruge rgba (). Den endelige værdi bestemmer gennemsigtighed: 0 for en solid farve og 1 til det gennemsigtige.

      Video: Vægfliser - lær om opsætning af fliser på væg i dit køkken eller bad

      baggrund: lineær gradient (til højre, rgba (147.184.116,0), rgba (147.184.116,1)) -
    • Del på sociale netværk:

    Relaterede
    © 2024 HodTari.com