CSS: vstavite sliko - tako deluje
V tem praktičnem nasvetu razlagamo, kako vstaviti sliko s pomočjo CSS. V bistvu lahko slike vstavimo sem v obliki slik ozadja. Vendar to povsem zadostuje.
Vstavite sliko v CSS
Na primer, če želite v glavo vključiti sliko s pomočjo CSS-ja, kot je vaš logotip, nato pod #header prijavite naslednje lastnosti:
- "ozadje: url (image.webp) #FFFFFF;"
- Tu se "bild.webp" razume kot URL do vaše slike bodisi glede na datoteko css bodisi kot absolutni naslov na vašem pogonu.
- Z barvo deklarirate barvo ozadja na svojem spletnem mestu.
- Slika je zdaj lahko postavljena s točno določenim položajem, na primer: "pozadina-položaj: 100px 100px;" ali prek relativnih informacij, ki jih določi rob okna, na primer "ozadje-položaj: desno spodaj;".
- Tako da se vaša slika ne ponavlja nenehno, lahko pod lastnostjo "ozadje ponovite" določite "brez ponovitve". To izgleda tako: "ozadje-ponovite: ne-ponovite;".
- S lastnostjo "background-attachment" določite, ali se slika premika z drsenjem ali ostane na določenem mestu na strani: "background-attachment: fix;".
- Lastnosti so določene v datoteki CSS brez narekovajev.
V naslednjem praktičnem nasvetu preberite, kako integrirati datoteko CSS z uporabo HTML-ja.