Pretty baby spin-doktorer http://1apotekonline.com/cialis/ sterling sølv pille kasse

Fast bakgrundsbild

Tänkte göra ett litet tillägg till guiden om hur man lägger till en bakgrund på sin blogg.

Om man vill ha en bakgrund som är fast, dvs den rör sig inte när man scrollar, så kan man ordna det.

Tänk på att det oftast är bäst att ha en riktigt stor bakgrund i så fall, som klarar av att täcka in hela bilden även om man har en upplösning som sträcker sig upp mot 1200 pixlar.
Givetvis så behöver du inte ha en så stor bakgrund, utan du kan ha en liten bild som du låter upprepas (läs längre ner)… den kan du också låsa fast.

Hur som helst….

Så här får man göra i så fall.

Utgå ifrån guiden jag gjort tidigare, med skillnad att om du ska ha en riktigt stor bakgrundsbild, så måste den laddas upp på någon annan server, annars kommer den skalas ner.

Koden du ska lägga in kommer nu att se ut på det här sättet istället:

body{
background-image: url(http://adressen till din bild);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
}

Det som är tillagt är de tre nedersta raderna; background-repeat: no-repeat; background-position: center center; background-attachment: fixed;

Jag ska förklara vad de betyder.

background-repeat – Skall bakgrunden upprepas om den inte täcker hela skärmen? Välj mellan no-repeat (upprepas ej), repeat-x (bilden repeteras åt höger men inte neråt) eller repeat-y (bilden repeteras neråt men inte åt höger)

background-position – Här anger man hur bilden skall positioneras. I exemplet så är bilden cetrerad både i höjdled och sidled. Använd dig av värdena top, bottom, left, right och center. Första värdet som anges är det i sidled och det andra är höjdled.

background-attachment – Den här kodraden anger precis det som vi vill göra, nämligen ha en bild som är fixerad. Så den behöver du inte ändra något i.

Använd detta tips tillsammans med inlägget om hur man lägger in en bakgrundsbild.

Grundare av Designa Din Blogg. Drev den här sidan som ett hobbyprojekt under åtta år, numera har jag lämnat över ansvaret för DDB. Är pappa till Ludvig och make till Elin.

Läs mina andra inlägg

80 comments

  1. SvaraAbbe

    Kan du förklara hur det är man ska göra för att ladda upp en större bild ?
    Jag fattar inte riktigt hur det är man ska göra när du säger ”ladda upp den på en annan server”. Har du ett förslag ?!

    1. Svaraelisejohanna

      är en bra sida där man kan ladda upp bilder som är större än 1000 px, så länge de är mindre än 10mb stora 😀

      1. Julia Cooling

        först testade jag med laddauppbilder.se men de funkade inte för allt blev vitt, sen testade jag imgsrc.com, då blev allt toppen ^^

      1. Hachi

        Jag gör bakgrunden jätte stor, men ändå så täcker den inte hela fältet bakom bloggen! (altså dr bakgrunden ska vara)
        hur fan ska man göra!?!??!

      2. EVELINA

        Lägg in repeat-y (så det går neråt) OCH repeat-x

        Då går den både neråt och åt höger så på så sätt täcker den allt!

  2. SvaraTintin ;)

    ja jag säger som Erica det är bara en litet del som syns det andra e vitt 🙁
    kan du göra ett inlägg på hur vi kan göra åt det ? 🙂
    det skulle värkligen vara jätte bra 🙂

  3. SvaraErica

    *ETT TIPS!* Om ni ska ha en stor bild (Jag fixa inte det där med de små som upprepas) och ska ladda upp den på en annan server så fungerar google! Kopiera URL och lägg in i bakround

    1. SvaraLisa

      Undrar också hur man laddar upp en större bild? har man inte en symetrisk bild blir det ju jättefult med ”repeat”. Så det jag undrar egnetligen är vart ovh hur man laddar upp bilden i större format. Fattar inte tipset med google heller..

      1. Sofia

        Testa skriva in
        color: #färgkod;
        efter background-attachment: fixed; men innan }

        ”#färgkod” går att byta ut mot färgen man vill ha, skrivet på engelska. T.ex. black, red, yellow o.s.v.
        Hoppas det funkar!

    2. SvaraFelicia

      Hur menar du att man ska ladda upp den? jag har aldrig laddat upp på en annan server förut, så jag förstår inte riktigt vad du menar :s

      1. Clara

        Hejsan! För att det inte ska bli vitt måste du lägga in bakgrunden i raden

         background-image: url(https://adressen till din bild); <strong> 

        också. Inte bara den som fanns innan. Det funkade för mig, lycka till! Hoppas du förstår, annars kan jag förklara lite längre om du frågar på min blogg. 😀

  4. SvaraAlva

    Hello, allt funkar som det ska men hur ändrar man bakgrundsfärgen bakom bilden? För vill inte att det ska vara vit utan grått. ^^

    1. SvaraChanel

      Jag var tvungen att göra så här för att bakrundsbilden till bloggen skulle fastna trots att jag skrollar ner..

       

       background: url( BAKRUNDSBILD);background-attachment: fixed}
    1. SvaraClara

      Hejsan! För att det inte ska bli vitt måste du lägga in bakgrunden i raden

      
      
      
      
      background-image: url(https://adressen till din bild); <strong> 
      

      också. Inte bara den som fanns innan. Det funkade för mig, lycka till! Hoppas du förstår, annars kan jag förklara lite längre om du frågar på min blogg.

      1. Jackie

        Det funkar bäst (iaf för mig) och det är lättast om man bara ändrar där man egentligen skriver färg.
        Ni vet när man lägger in en bild som bakgrund?? Det räcker med att skriva om den koden till

        background: url( BAKRUNDSBILD);background-attachment: fixed}
        
  5. SvaraElectricVeins

    Tja! jag har försökt med allt.. att få in en bakrundsbild som är längst ute vis sidorna höger och vänster. typ. jag och en kompis lutar oss mot väggen:) men då man lägger upp bilden på bloggen så kan man bara ställa in det på 1000 px 😛 eller nått sånt! är det nått man kan fixa? isåfall vill jag att du gör en guide till det. om du kan 😀

  6. Svaraevelin

    Jag skulle vilja veta hur man fixar ”boxar” i menyn…
    Alltså hur man delar menyn i delar 🙂 Vore jätte snällt om du kunde visa hur man gör det!

  7. Svaraisabel

    hej kan inte du göra ett inlägg om hur man lägger in en bild i meny och sen vid mousover blir det en annan? tacksam för svaaaaar

  8. SvaraMatilda

    Hej! Undrar om det finns ett inlägg om hur man lägger in en bild automatiskt efter varje bild, tex på isabell strömbergs blogg? Annars hade det varit en bra guide 😀

  9. SvaraPetra

    Superbra guide!
    Har lyckats lägga upp en fast bakgrundsbild men nu har jag en fråga.
    Har en helt grå bakgrund och på vänster sida ligger det en bild så då är mina fasta bakgrundsbild men nu vill jag ha en bild på höger sida oxå. Hur gör jag det?

    Har lagt in samma kod igen nedanför men på nåt sätt lyckas antingen den vänstra eller högra bilden ta över för jag kan aldrig se båda bilder.

    Tacksam för svar!

  10. SvaraEmelie

    Hur för man så att menyn (side) stannar kvar. så att det bara är inläggen som rullar upp och ner? som på den här bloggen,
    om någon fattar uppskattar jag hjälp!

    1. SvaraLisa

      Hej

      Jag skulle vilja veta om du fick nåt svar på din fråga om hur man får menyn att stanna kvar?
      Jag har problem med en meny som åker upp och ner när jag gör ett inlägg, tänkte att det här kanske kan lösa mitt problem.

      Tacksam för svar:)

      / Lisa

    2. SvaraLollo

      Hej! Jag har en sån meny och jag fixade det genom att skriva fixed i stället för absolute eller relative eller vad det nu står på position. Under avsnittet #side i stilmallen. Så det står
      position: fixed;

      Men vill också nämna att när jag hade gjort det här för att testa och sedan när jag skulle ändra tillbaka så hamnade menyn längst ner snett under alla inlägg. Jag vet inte varför det blev så… Men jag rekommenderar att du sparar en backup i alla fall på side delen om du gör det här.

      Hoppas det här hjälper 🙂

  11. SvaraNathalie Augustsson PHOTO

    Det har alltid funkat för mig, men nu så blir det vitt som det blivit för alla andra. Varför? Och jag förstår inte riktigt det där med att ladda upp på en annan server? Har gjort det men det funkar endå inte. Skulle vara super gulligt om någon kunde hjälpa mig. Och besök gärna min blogg: https://nathalajj.blogg.se 🙂

  12. Svaraalicia

    Hej! Jag förstår inte vart man ska klistra in koden? Det skulle vara bra om du skriver exakt vart man ska klistra in den utan att det blir fel! 
    Tack! 🙂

  13. SvaraMichaela

    Hur stor bild ska man ladda ner från början? (t.ex. från google) Du nämnde nånting med 1200 pixlar men fattade inte riktigt det..? Skulle vilja ha en landskaps-bild som bakgrund som inte rör på sig när man scrollar nedåt/uppåt. Eller ja, det som det här inlägget handlar om. Men hur gör man på imgsrc.com? Hur stor ska den bli till slut liksom? Tacksam för svar!

  14. Svarafreja

    det funkar för mej att lägga in bilden, men går det inte att ändra färgen runt omkring? nu blir den bara vitt, alltså när man scrollar ner och bilden tar slut så är det bara vitt, men jag vill ha det i brunt!

  15. SvaraElin

    Tack så supermycket!:D Hade nämligen en bakgrund som övergår från ljusblått till vitt, och det blir ju jättehackigt om det blir vitt, sen HOPP ljusblått igen:P Och fult xP

  16. Svaralouise falk

    hej när jag gjorde detta så försvann menyn på höger sida! och jag undrar hur jag ska få tillbaka det ? :O

  17. SvaraJosefin Norlén :)

    Ta bort strecket mellan ”no” och reapet” då funkade de för mig 😀 <33 till alla er som har problem med att inte hela bakgrunden syns<3

  18. SvaraLouise

    Jag vill att min bakgrundsbild INTE ska röra sig när man scrollar vilket den gör just nu. Hur gör jag då?? 

  19. Svarafia

    Jag skulle verkligen vara jättetacksam om jag kunde få hjälp med detta. Jag har ändrat min meny från höger sida till vänster sida och alltså ändrat mina inlägg från vänster sida till höger sida. Så om man kollar på startsidan så ser det bra ut. Men däremot om jag klickar på en av mina kategorier så är min meny helt plötsligt alldeles för mycket till höger så när man alltså klickar på en kategori så ser det helt galet ut.

  20. SvaraJulia

    Hej, jag har en bakgrund som upprepas längre ner i bloggen, om jag bara vill ha den i början (alltså allra längst upp) Hur gör jag då?

  21. SvaraMoa

    Har jag fattat fel nu? Visst handlar det här inlägget om hur man får sin bakgrund att FASTNA, alltså inte repeteras om man scrollar ned? För det är det jag är ute efter men koden ovan funkar inte alls för mig. Jag vill ha en bild som det bara är mönster på vänstersida, och vitt på höger, men istället så repeteras bilden så jag har två bilder brevid varandra och bakgrunden är INTE stilla, som jag trodde att den skulle bli om jag gjorde som det står i inlägget ovan.  
    Är det bara för mig det inte funkar?  
    använder mig utav blogg.se btw

  22. SvaraFrida

    Alltså jag får min bakgrund överallt om ni förstår? bakgrunden är i mina inlägg och menyn och allt, jag vill ha vit bakrund i menyn och där mina inlägg är.. och snälla säg inte att jag måste byta tema för då måste jag ju göra om alla koder!?

    Sen så har jag bytt färger på mina länkar men dom bytte tillbaka av sig själv? dom är blå igen fast jag har ändrat dom, det fungerade ett tag till och med -.-””

  23. SvaraDonna

    hejsan kan du hjälpa mig med min blogg för jag har lakt ut bakrundsbild i bloggen men vet inte om jag la rätt kod stället för när jag provar gå in min blogg i en annan dator så försvinner bakrunden och står brara massa kod text snälla kan du hjälpa mig jag vet inte vad som är felet

  24. SvaraPernilla

    Varför fungerar inte denna kod på alla stilmallar? Testade precis på den där fashion och den fungerade där. Nu vill jag ha den där med en stad i headern och där fungerar den inte? Det har gjort det förut?


    1. Author
      SvaraLari

      I din stilmall har du lagt in detta:

      body{
      background-image: url(https://beyss.blogg.se/images/2012/1325i1r3963p-25323_186957985.jpg); &lt;strong&gt;
      background-repeat: &lt;/strong&gt;no-repeat;
      &lt;strong&gt;background-position:&lt;/strong&gt; center center; &lt;strong&gt;
      background-attachment:&lt;/strong&gt; fixed;
      }
      

      Byt ut det mot detta:

      body{
      background-image: url(https://beyss.blogg.se/images/2012/1325i1r3963p-25323_186957985.jpg);
      background-repeat: no-repeat;
      background-position: center center;
      background-attachment: fixed;
      }
      
  25. SvaraKajsa

    Tack så hemskt mycket för hjälpen! Jag håller på att göra en bloggdesign till min blogg och detta hjälpte jättemycket.
    Tack för att denna sidan finns! ;D

  26. SvaraMaria

    Hej! Jag har temat Bokeh och jag kan inte hitta något i min stilmall som heter Body. Hur byter man till en egen bakgrund på bokeh?

  27. SvaraValeria

    Hej, jag har teman Bokeh, och den har mörk bakgrund. jag vill byta den till en egen bild, hur gör jag? jag har provat med att klistra in detta i stilmall:
    #body{
    background-image: url(https://adressen till din bild);
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    }

    MEN det funkar inte!

  28. SvaraLisa

    För mig blir min bakgrundsbild för liten, så halva bakgrunden (vänster sida) blir min bild och andra halvan (höger sida) blir temats bakgrund. Hur ska jag göra?

  29. SvaraSanna

    Hej!

    Jag hittar inte det jag letar (tror jag).
    Jag vill ha ett inlägg fastnålat på första sidan, som en slags ”startsida”. Som man kan ha på wordpress ungefär. Finns det till blogg.se, och hur gör man då?

    Mvh
    Sanna

    1. SvaraSanna Preifelt

      Dessvärre är det inte möjligt på blogg.se, det du skulle kunna göra är att du lägger alla inlägg i en subdomän (dinblogg.blogg.se/blogg) och sedan har du roten (dinblogg.blogg.se) där du skapar ett enda inlägg som då får ligga på startsidan, och sedan får allt annat länka till subdomänen. Det är inte jättekomplicerat, men det är väldigt omständligt.

Lämna ett svar

E-postadressen publiceras inte. Obligatoriska fält är märkta *