Gå til innhold

AJ-Fork endring av font size+colour+bacground?


Anbefalte innlegg

Videoannonse
Annonse

Har du allerede et ekternt stilark? I så fall er det her du enkelt gjør endringene, om du ikke vil bruke inline-css på alle elementene.

 

Dersom du ikke har et eksternt stilark, gjør følgende;

 

Lag en ny fil i Notisblokk eller Dreamweaver. Lagre den som style.css i samme mappe som index.php-filen din.

Legg til denne snutten i mellom <head>-taggene i index-filen din;

 

<link href="style.css" rel="stylesheet" type="text/css">

 

Du har nå et (tomt) stilark koblet opp mot websiden din.

Finn ut hvilke elementer AJ bruker i templaten. Om jeg ikke husker feil, bruker den h1 som overskrifter og så bruker den p til vanlig tekst.

 

Legg inn følgende i stilarket ditt;

 

h1 {
 font-family: Tahoma, Verdana, sans-serif;
 color: blue;
 font-size: 1em;
}

p {
 font-size: 0.8em;
 color: grey;
}

 

Du har nå laget stiler for disse to elementene. Last opp style.css og index-filen din til web, og du skal nå se forskjellen om du har gjort det riktig. Dette var bare helt enkle eksempler på formatering, en full oversikt over egenskaper/verdier du kan bruke, finnes i CSS2 Reference. Font er vel det meste aktuelle i ditt tilfelle.

 

Ønsker du å ikke bruke en ekstern CSS-fil, kan du style elementene direkte i templaten;

 

<h1 style="font-family: Tahoma, Verdana, sans-serif; color: blue; font-size: 1em;">{title}</h1>

 

Jeg vil anbefale deg at du lærer deg litt grunnleggende HTML og CSS, det vil du alltid få nytte for. HTMLDog og W3Schools er finne utgangspunkt for en nybegynner.

Lenke til kommentar

Tipper du ikke har et stilark, men du kan sette denne koden inn mellom <head og </head taggene dine.

 

<style type="text/css">
p {
font-family: arial;
}
</style>

 

EDIT: PoleCat var før meg, og du burde helst gjøre slik han har forklart å prøve å lære deg HTML og CSS før du endrer på templaten.

Endret av Skomaker
Lenke til kommentar

Ja! Er i CSS (stilarket) du endrer alt sånn, ikke i templaten! I fila show_news.php (tror det er det den heter) så legger du inn denne kodesnutten i <head>:

 

<link href="example.css" rel="stylesheet" type="text/css">

 

Og i example.css (åpne i notepad eller noe) så står det skrifttyper, farger, str og alt for hver sin del av aj-fork!

 

Feks div.articletext er for teksten i artikkelen:

 

div.articletext {
font-family: "Verdana";
font-size: 9pt;
color:#155970;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
}

 

h1 er for overskrift 1, h2 for den under. Det er bare og prøve seg frem og se hva som gjelder for hva hvis du skulle være i tvil om det! :thumbup:

Lenke til kommentar

Her er en mer ryddig utgave av example css:

 

(tror jeg, hehe)

 

/* CuteNews */

h1 {
  
margin-bottom: 2px:
padding: 0;
font: 12px "Verdana", Arial,Helvetica,sans-serif;
color: #FFFFFF;
letter-spacing: 0px; 
font-weight:bold; 
text-transform: uppercase;
}

h2 {
margin: 0px 0px 0px 0px;
padding: 0;
font: 10px "Verdana", Arial,Helvetica,sans-serif;
color: #FFFFFF;
text-transform: uppercase;
}

/* Form felt*/
input, textarea {
font-family: "Verdana", Verdana, Arial, sans-serif;
font-size: 12px;
color: #777777;
}

/* Ikon rammer */	
img {
border: 0px;
}

div.article {
font-family: "Verdana";
font-size: 9pt;
color:#000;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
border-bottom: 1px dashed #FFFFFF;
}



div.articletext {
font-family: "Verdana";
font-size: 9pt;
color:#155970;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
}


.cn_comment_even {
font-family: "Verdana";
font-size: 10pt;
color:#FFFFFF;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
}



.cn_comment_odd {
font-family: "Verdana";
font-size: 10pt;
color:#FFFFFF;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
}


.desc {
font-family: "Verdana";
font-size: 10pt;
color:#000;
margin-left:0px;
margin-right:0em;
line-height: 130%;
text-align: left;
}

.specials em {
font-family: "Verdana";
font-size: 10px;
color:#000;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
}


#latestcomments {
font-family: "Verdana";
font-size: 10pt;
color:#FFFFFF;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
}

#comment {
font-family: "Verdana";
font-size: 10pt;
color:#FFFFFF;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
}

.comment {
font-family: "Verdana";
font-size: 10pt;
color:#FFFFFF;
margin-left:0em;
margin-right:0em;
line-height: 130%;
text-align: left;
}

:w00t:

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...