Flikar på din blogg
Tänkte visa hur man får flikar på sin blogg. :P
# 1. Gå till din Stilmall.
Kopiera koden här under med Ctrl C
# 1. Gå till din Stilmall.
Kopiera koden här under med Ctrl C
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.mattblacktabs{
width: 100%;
overflow: hidden;
border-bottom: 1px solid black; /*bottom horizontal line that runs beneath tabs*/
}
.mattblacktabs ul{
margin: 0;
padding: 0;
padding-left: 10px; /*offset of tabs relative to browser left edge*/
font: bold 12px Verdana;
list-style-type: none;
}
.mattblacktabs li{
display: inline;
margin: 0;
}
.mattblacktabs li a{
float: left; /*Ändra till right om du vill ha flikarna till höger*/
display: block;
text-decoration: none;
margin: 0;
padding: 7px 8px; /*padding inside each tab*/
border-right: 1px solid white; /*right divider between tabs*/
color: white;
background: #414141; /*background of tabs (default state)*/
}
.mattblacktabs li a:visited{
color: white;
}
.mattblacktabs li a:hover, .mattblacktabs li.selected a{
background: black; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */
}
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.mattblacktabs{
width: 100%;
overflow: hidden;
border-bottom: 1px solid black; /*bottom horizontal line that runs beneath tabs*/
}
.mattblacktabs ul{
margin: 0;
padding: 0;
padding-left: 10px; /*offset of tabs relative to browser left edge*/
font: bold 12px Verdana;
list-style-type: none;
}
.mattblacktabs li{
display: inline;
margin: 0;
}
.mattblacktabs li a{
float: left; /*Ändra till right om du vill ha flikarna till höger*/
display: block;
text-decoration: none;
margin: 0;
padding: 7px 8px; /*padding inside each tab*/
border-right: 1px solid white; /*right divider between tabs*/
color: white;
background: #414141; /*background of tabs (default state)*/
}
.mattblacktabs li a:visited{
color: white;
}
.mattblacktabs li a:hover, .mattblacktabs li.selected a{
background: black; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */
}
# 2. Klistra in koden längst ner i din Stilmall
# 3. Tryck Spara.
# 4. Gå till din Kodmall och lägg följande kod precis under <div id="content">
# 2. Klistra in koden längst ner i din Stilmall
# 3. Tryck Spara.
# 4. Gå till din Kodmall och lägg följande kod precis under <div id="content">
<div class="mattblacktabs">
<ul>
<li><a href="adressen till sidan">Länk 1</a></li>
<li><a href="adressen till sidan">Länk 2</a></li>
<li><a href="adressen till sidan">Länk 3</a></li>
<li><a href="adressen till sidan">Länk 4</a></li>
<li><a href="adressen till sidan">Länk 5</a></li>
</ul>
</div>
# 5. Sen tryck Spara och se efter om det funkade.
Hur man ändrar länkar, färger och allt sånt där förväntar jag mig att ni redan vet hur man gör..
Lycka till! ;)
OBS! Ibland funkar det och ibland inte.
# 5. Sen tryck Spara och se efter om det funkade.
Hur man ändrar länkar, färger och allt sånt där förväntar jag mig att ni redan vet hur man gör..
Lycka till! ;)
OBS! Ibland funkar det och ibland inte.
Kommentarer
Postat av: Ninsi
Det fungerar nt ... :(
Min blogg: www.weinchi.blogg.se :P
alltså, det är Nini, Weini .. XD
min blogg håller på att fixas så jag gör allt som du lärt i din blogg i en test blogg . :)
Postat av: Yujing
Du har ju gjort min design. (^_^) <3
Men om jag vill ha en V-Bild var ska man sätta in den då??
Trackback
