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

Border – Ramar/Kantlinjer

Attributet border är något som är välanvänt i stilmallarna här på blogg.se.

Man kan använda sig av det på i stort sett allt på en blogg, och det finns många olika sätt att skriva koden på.

Jag skall visa vilka varianter av borders det finns, och hur du skriver koden.

De saker man kan styra i sin kod, är följande:

border-style (vilken typ av kantlinje det ska vara.)
Välj mellan följande:
Solid

border-style: solid;

Dotted

border-style: dotted;

Dashed

border-style: dashed;

Double

border-style: double;

Groove

border-style: groove;

Inset

border-style: inset;

Outset

border-style: outset;

Ridge

border-style: ridge;

None (ingen alls)

border-style: none;

Tänk på att vissa stilar kräver en viss bredd på linjen för att den ska synas, så om det bara ser ut som en vanlig solid linje, så öka på bredden på linjen då.
border-width (hur bred kantlinjen skall vara)
Absolut bäst är att ange bredden på kantlinjen med pixlar, t ex 4px.
Det finns även färdiga måttangivelser:
thin

border-width: thin;

medium

border-width: medium;

thick

border-width: thick;

10px

border-width: 10px;

border-color (anger färgen på kantlinjen)

Färgen på själva kantlinjen anger du med koden border-color: din färg;
Du kan ange koden med antingen hexadecimaler (t ex #000000) eller med namn (t ex black).
Några exempel:

border-color: black;

 

border-color: #CC55CC;

 

border-color: red;

Border uppe, nere, höger och vänster
Man kan välja vilka sidor man vill ha en kantlinje på. Tänk dig att du har en fyrkantig låda, och så vill du bara ha kantlinje uppe och på vänster sida.
Då kan du styra det med hjälp av din stilmallskod. Då anger du bara en kantlinje uppe (border-top) och en kantlinje till vänster (border-left).
Hur skriver man koden då?

Kantlinje uppe

border-top:solid medium black;

Kantlinje nere

border-bottom:solid medium black;

Kantlinje vänster

border-left:solid medium black;

Kantlinje höger

border-right:solid medium black;

Kantlinje runt om

border:solid medium black;

Jag vet att allt det här kan vara lite knepigt att förstå sig på, men det är bara att testa dig fram en massa.
Man lär sig absolut lättast genom att prova på olika sätt, men snälla, ta en kopia av din stilmall först.

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

19 comments

  1. SvaraVendela

    Hur gör man för att ändra den border som är längst ner i ett inlägg,innan reklamen kommer? 🙂

  2. Svaraemma

    för ett tag sen la jag in en svart linje runt hela min blogg och nu vill jag ta bort den för min blogg ser konstig ut på vissadatorer så jag vill ta bort den svarta linjen igen men kommer inte ihåg hur man gör… 🙁 hjälp mig xd

    1. SvaraEline

      Det beror lite på vart du vill ha dina linjer. du kan klistra in dom under wrapper, content och side. Wrapper är hela bloggen, side är menyn och content är där du skriver innehållet. Lycka till!

  3. SvaraNaemi fotografi ♥

    Jag försökte, skulle ha det runt om komentarerna. Men det gick inte, det kom bara en ruta runt om namnet på komentarerna. Vad gjorde jag fel?

  4. SvaraHyvelTjuven

    Jag skulle vilja att min border som jag har precis under headern går ända ut i webbläsarens hörn, alltså att den inte är centrerad i mitten och tar slut, hur gör jag detta.

    Här är min blogg:
    Hoppas ni kan förstå vad jag menar

    1. SvaraZabbe

      Den tar slut pga att headern inte är större än så 😛 Antingen gör du din header bredare eller så kan du göra en bakgrund som passar ihop med linjen under headern 😛 Nått annat sätt kan jag inte komma på för tillfälle.

  5. SvaraEvelina Larsson

    Hej, jag undrar hur jag får bort alla dom röda ramarna som är över hela min blogg. Har sökt runt i åratal men hittar inte! Snälla svara.

  6. SvaraRebecca Candevi

    Hejsan!
    Jag vill lägga in en rundad linje runt min meny. Jag vet var jag ska lägga in koden och så men problemet är att jag inte vet vad det är för kod jag ska lägga in 🙂 hahaha
    Allt jag hittar är helt fyrkantiga inramningar men jag vi ha det rundat i kanterna. Jag hoppas du förstår vad jag menar. Tacksam för hjälp!

  7. SvaraAlexandra

    Hur gör jag om jag vill ha ett mellanrum mellan varje inlägg och en ram runt själva inläggen? Så att de blir separerade ifrån varandra.
    Mvh Alexandra

  8. SvaraSofie

    Jag har lyckats lägga in kantlinjer överallt där jag vill ha dem men förutom ”border-top”
    oavsett om jag gör den tjockare så syns de inte på bloggen. Varken på content, header eller side.
    har testat med att göra den i fler px samt i andra färger. Om du klickar in så ser du precis var linjerna fattas.. Hur får jag bot på detta? Tacksam för svar!

    1. SvaraFelix

      Om du menar att det ser ut som två så är det för att hon har skrivit den som double. Alltså så här ser det ut då:

      border:2px double #000;
      

Lämna ett svar

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