DESIGNHJELP

Det er noen som har spurt om vi kunne legge ut html-koder å seffølgelig kan vi det! Disse HTML-kodene fann vi på www.bekkelien.blogg.no

Nyttig info :

Noen tips;
CTRL + A = Merk alt
CTRL + C = Kopier
CTRL + V = Lim inn
CTRL + F = Søk

Fargekart:
http://www.myspacedev.com/color-codes/ < her finner du mange farger, gå inn her !

ULIKE RAMMER TIL RAMMER RUNDT BLOGGEN DIN ELLER HEADEREN DIN  !

solid
dashed
dotted
double
groove
ridge
inset
outset

______________________________________________________________________________________________

MELLOMROM MELLOM HEADER OG BLOGGANDRESSE :

Gå inn på Design > Rediger > Stilsett.
Let så opp wrapper og sett inn denn koden  inn under der :

margin: 0px, 0px, 0px;

Du kan få større mellomrom, bare forandre på det første tallet, eks:  margin: 2px, 0px, 0px;

____________________________________________________________________________________________


SKIRFT UNDER MENYLINJENE, KATEGORIER.

Denne koden limer du inn nederst i stilsettet :

/** Entry headers **/
h3 {
font-family: Verdana, serif;
font-size: 20px;
color: #585858;
background-color:#;
border-bottom: 3px double #000000; < der skifter du farge på streken .

_____________________________________________________________________________________________

RAMME RUNDT BLOGG/ HEADER :

Først går du inn på Design > Rediger > Stilsett

Om du skal du ha det rundt bloggen din :

#wrapper {
background-color: #FFFFFF;
border: 2px dotted #000000; < her kan du fikse farge på rammen .
}
#footer {
background-color: #FFFFFF;
border: 2px dotted #000000;

Du kan også få den sjukkere eller smalere: ta da  eks : border: 3px dotted #000000;
Du kan også få en annen ramme rundt den : solid istedet for dotted.
( eller så kan du gå oppover på siden og finne en av de rammene der )

Om du vil ha ramme rundt header så lim inn den samme koden bare her :

#header {
background-color: #FFFFFF;
background-image: url('http://haawt.blogg.no/images/css/eac960022e9cfbb496ca58d05f9c1e66.jpg');
height: 380px;
( KODEN INN HER )
background-repeat: repeat;

___________________________________________________________________________________________

MIDSTILT BLOGG :

Om du vil ha midtstilt blogg så går du inn på stilsett.

Limer da inn denne koden :
#header {
background-color: #FFFFFF;
height: 236px;
margin-left: auto;
margin-right: auto;

}
#wrapper {
background-color: #FFEFFC;
margin-left: auto;
margin-right: auto;

}
#footer {
background-color: #FFFFFF;
margin-left: auto;
margin-right: auto;

______________________________________________________________________________________________

MENY FRA HØYRE TIL VENSTRE:

Du går inn på stilsttet og da skal det s sånn ut :

#wrapper {
background-color: #FFFFFF;
border: 2px dotted #000000;
}
#main {
float: right;
}
#side {
float: left;
}
#footer {
background-color: #FFFFFF;
border: 2px dotted #000000;
}
#main {
float: right;
}
#side {
float: left;
}


Hvis du vil ha menyen i en liten boks, så skal du legge inn denne koden:

border: 1px solid #000000;
background-color: #4D4D4D;

Hvor legger jeg den inn?
Hvis du ser under her så ser du hvor du skal lime den inn.

#wrapper {
background-color: #FFFFFF;
border: 2px dotted #000000;
}
#main {
float: right;
}
#side {
float: left;
border: 1px solid #000000;
background-color: #4D4D4D;
}

}
#main {
float: right;
}
#side {
float: left;
}
#footer {
background-color: #FFFFFF;
border: 2px dotted #000000;

______________________________________________________________________________________________

BAGRUNNER:

10  9 8 7


4 3



_____________________________________________________________________________________________

FÅ  LITEN SKRIFT ISTEDT FOR STANDARSKIRFTEN : 

Her inne skal du føye på denne koden:
font-size: 8pt;  

Å den skal være på plassene markert med fet skrift:

#wrapper {
width: 610px;
background-color: #FFFFFF;
font-size: 8pt;
}
#footer {
width: 610px;
background-color: #FFFFFF;
font-size: 8pt;
}
a { color: #000000}
a:link { color: #000000}
a:visited { color: #510300}
a:active { color: #000000}
h1, h2, h3, h4, h5 { font-family: Arial, Helvetica, sans-serif; }
#header h1, #header p { display:none }
#header { color: #000000;
font-size: 7pt;}
h1 a, h1 a:link, h1 a:visited, h1 a:active { text-decoration: none; color: #000000; }

_____________________________________________________________________________________________

SMAL BLOGG : 


For å få bloggen smalere må du føye til den koden:
width: 610px;

Den skal du sette rett under der det står
height: 165px;

Da ser det ut som dette:
#header { background-color: #FFFFFF;
background-image: url('LINKEN TIL HEADEREN DIN...');
height: 165px;
width: 610px;

Etter du har gjort dette gjør du akkurat det samme der det står #wrapper & #footer. Å da skal det se slik ut:

#wrapper {
width: 610px;
background-color: #FFFFFF;
}
#footer {
width: 610px;
background-color: #FFFFFF;
}



______________________________________________________________________________________________

BAGRUNN SOM STÅR FAST : 


Koden:
BODY {
background-image: url("her skal URL'en til bildet stå");
background-attachment: fixed;
background-position: right bottom;
background-repeat: repeat;
}

Om du ikke bruker et spessielt bildet som bagrunn behøver du ikke og skrive inne noen URL kode, men om du har bildet, må du det ! 

____________________________________________________________________________________________

STØRRELSE PÅ OVERSKIRFTENE : 

Tekst størrelsen på overskriftene:

h2 { font-size: 50% }

Denne skal limes inn nederst i stilsettet !

______________________________________________________________________________________________

BAKGRUNNSFARGE PÅ OVERSKRIFT

Koden:
h2 {
cursor:default;
background-color: #BAD5EC;  < hvilken farge du vil ha !
color: #000000;
font-size:9pt;
font-family:tahoma;
letter-spacing:1px;
line-height:13pt;
text-align: center;
padding: 1px;
font-weight: bold;
text-transform: uppercase; 
margin-bottom: 0px; margin-top: 0px; margin-right: 0px; margin-left: 0px;

Denne koden skal du legge inn nederst i stilsettet!

______________________________________________________________________________________________

MENY UNDER HEADER ! 
Denne er litt mer komplisert enn de kodene jeg har her fra før. For å plassere denne må du først:
Gå inn på Design -> Rediger -> Maler. Deretter trykker du Ctrl + F (samtidig) og skriver inn BlogDescription å trykker på Enter. Rett under BlogDescription står det </div>, under </div> er hvor du skal plassere koden:

<div class="mattblacktabs">
<ul>
<li><a href="URL-ADRESSE">NAVN PÅ KNAPPEN</a></li>
<li><a href="ULR-ADRESSE">NAVN PÅ KNAPPEN</a></li>
<li><a href="URL-ADRESSE">NAVN PÅ KNAPPEN</a></li>
<li><a href="URL-ADRESSE">NAVN PÅ KNAPPEN</a></li>
<li><a href="URL-ADRESSE">NAVN PÅ KNAPPEN</a></li>
</ul>
</div>


Der det står "linken din" plasserer du linken til de forskjellige innleggene.

Skal du ha f.eks 1 til knapp så føyer du på denne:
<li><a href="URL-ADRESSE">NAVN PÅ KNAPPEN</a></li>
Du skriver navnet du vil ha på "knappen" der det står Navn på knappen.
Når du har plassert den koden må du ta og plassere denne NEDERST inne på Maler.

<style type="text/css">

/*Credits: Dynamic Drive CSS Library */

.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;
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 */
}

</style>


Så til slutt lagrer du, så klart. Å har du gjort alt rett skal menyen være OK.

Til dere som ikke får noe resultat av dette: Om dere har gjort alt riktigt så SKAL det virke. Men jeg viser til at det kan hende det ikke virker i en annen nettleser enn Internet Explorer.


______________________________________________________________________________________________
Håper du kunne bruke noe av dette! Er det noen flere koder dere vil ha, isåfall si ifra !

Les mer i arkivet » Juli 2012 » Juni 2012 » Mai 2012
Stine og Sine -

Stine og Sine -

14, Vestre Slidre

Vi er to bestevenner fra en liten kommune i Valdres kalt Vestre Slidre. På bloggen vår skriver om alt mulig, men mest fotografering. Stine har Nikon D5000 og Sine har Nikon D5100. Vi har en likepage på facebook så hvis du vil så kan du veldig gjerne like bloggen vår på facebook!

    Image and video hosting by TinyPic Hei og velkommen! Vi er to jenter på 14 og 15 år fra Valdres med navn Sine og Stine. Vi har begge en stor interesse for fotografering, og er nikonfrelst. xoxo

    + Legg oss til som venn

Kategorier

Alt og Ingenting Blogg Design Hårtips things Videoer Vurderinger

Arkiv

Juli 2012 Juni 2012 Mai 2012 Februar 2012 Mars 2011 Februar 2011 Januar 2011 Desember 2010 Juli 2010 Juni 2010 Mai 2010 Mars 2010 Februar 2010 Januar 2010 Desember 2009 November 2009 Juli 2009 Mai 2009 April 2009



hits