18. Oktober 2017 21:32
Navigasjon
Besøkende
· Gjester online: 6

· Medlemmer online: 0

· Antall medlemmer: 508
· Siste medlem: Olet
Sist Sette Brukere
· dogbone 1 uke
· Kenneth 7 uker
· paulen17 uker
· Johnny Viinb...31 uker
· bulldog-nilsen88 uker
· hYper93 uker
· quiki94 uker
· torsteinram120 uker
· Frosty148 uker
· Craig167 uker
Siste artikler
· Backup - Sikkerhetsk...
· Themes - Tema
· TinyMCE - Html-redig...
· Paneler
· Locales - Språkfiler
Fødselsdager
tjacobt18 Okt
assensvej20 Okt
madsruud21 Okt
ColdFox24 Okt
hkonsig25 Okt
hYper31 Okt
Kolaas07 Nov
Norion10 Nov
paanilse11 Nov
Dark Shadow16 Nov
Support Sider
PHP-Fusion v7 CSS

PHP-Fusion v7 CSS

Her er en oversikt over stiler som er/skal være i alle tema 'styles.css' - stilmalen for siden din. Alle tema vil ha andre stil-classer som bare de bruker, men de classer som her er demonstrert brukes gjennomgående i hele PHP-Fusion. Derfor - stilene her må finnes alle tema.

Nederst finner du et eksempel på en 'styles.css' med bare standard PHP-Fusion 7 CSS. Filen som er brukt er fra Gillette-temaet av Nick Jones.

Skrevet av Sveinung Skjærseth den 2. juli 2008
Sist oppdatert: 25. februar 2009

Lenker

a :

Lenke som bruker a

a.side :

Lenke som bruker a.side

Lenke-class a brukes hvis ingen andre lenke-stil er definert.
Lenke-class a.side brukes i side-paneler.

Knapper og tekstbokser

.button


.bbcode


.textbox


Meldinger med mer

.admin-message
En melding som krever oppmerksomhet! :)

.quote
Tekst som er sitert. Her brukes class'en .quote

.poll Søylen som vises ved avstemming bruker .poll



Generelle stiler for siden

body - hovedbakgrunn / skrift hvis ikke angitt andre steder.

Dette er tekst vist ved hjelp av body

.alt - alternativ tekst Tekst vist ved hjelp av .alt class

.comment-name - navn på gjester i kommentarer.

Tekst som bruker comment name

Horisontale linjer

.hr
.hr-side-hr


Overskrifter

.Forum-caption

- Overskrift brukt i forum index, nedlasting m.m.

Nyheter


Class'en .news-category brukes for å posisjonere nyhetkategori-ikoner.

Tabeller

.center - sentrerer noen tabeller/divs
.tbl-border - kantlinje for tabeller/divs
Tekst vist med .tbl-border

.tbl - generell tbl class:
Tekst vist med .tbl


.tbl1 og .tbl2

Eksempel på tekst vist med .tbl1
Eksempel på tekst vist med .tbl2


Tabelleksempel som bruker alle .tbl - class'ene
(.tbl-border for første div, så .tbl, .tbl1 og .tbl2)

Eksempel class tbl
Eksempel class .tbl1
Eksempel class .tbl2
Eksempel class .tbl1
Eksempel class .tbl2


Shoutbox - Replikkboks

Replikkboksen har tre egne class'er - .shoutboxname, .shoutboxdate og .shoutbox

Replikkboks



Gjest Navn .shoutboxname
06.06.08 .shoutboxdate


Dette er bare

en replikk :) .shoutbox


Small

.small Tekst stilet med .small

.small2 Tekst stilet med .small2

.side-small Tekst stilet med .side-small

.side-label Overskrifer i navigasjonspanel *

(Merk at css navigation panel bruker egne class'er, også for overskrifter i navigasjonspanelet)

Sidenavigering

Sidenavigeringen er stilet med
.pagenav og
.pagenav span

Du kan legge til active- og mouseover status ved hjelp av
.pagenav a og
.pagenav a:hover

Eksempel på sidenavigering:

CSS Navigeringspanel

Dette er et navigasjonspanel som kan ha det utseendet du vil
Her er standard class'er som panelet trenger for å virke:

#navigation - wrapper for navigeringspanelet
#navigation h2 - det samme som .side-label i det vanlige navigeringspanelet.
#navigation ul - stil for ul listen som utgjør navigeringspanelet ditt.
* html #navigation ul li, #navigation a {height: 1%;} - et lite "hack" for Internet Explorer
#navigation a - lenkestil
#navigation a:hover - lenkestil når musen peker på lenken
#navigation a span - span stil for lenkene (padding osv.).

CSS Toppnavigering

Den samme teknikken som brukt i CSS Navigeringspanelet kan også brukes i toppnavigeringen (menybjelken).
Classer og teknikken er opp til den som lager temaet, og vil ikke forklares nærmere. Men muligheten er nå der.

TinyMCE

Alle som bruker TinyMCE vil oppleve at bakgrunnen i editor-vinduet blir preget av body classen. I tema med mørk bakgrunn/grafikk i body bør denne css'en legges til hvis den ikke allerede er der:
GeSHi: CSS
  1. /* TinyMCE specific rules */
  2. body.mceContentBody { background: #FFF; color: #000; }
  3. .mceContentBody a { color: blue !important; /* FX requires a important here */ }
Parset på 0.014 sekunder, ved hjelp av GeSHi 1.0.8.10


Vanlige class'er - andre

Det er andre class'er som er vanlig å bruke, men disse varierer fra tema til tema.

a.white - ofte brukt for lenker i toppnavigering (menybjelke)
full-header - ofte brukt for header/banner
sub-header - ofte brukt for å bestemme utseende på tabeller/div's som holder menybjelken

Følgende class'er / id'er er svært viktig for hvordan temaet oppfører seg:

.side-border-left (eller #side-border-left) - venstre sidepanel bakgrunn og oppførsel
.side-border-right (eller #side-border-right) - høyre sidepanel bakgrunn og oppførsel
.side-left/#side-left .side-border-right {display: none;} - brukes for å gjemme venstre sidepaneler hvis bestemt i Hovedinnstillinger.
.side-right/#side-right .side-border-left {display: none;} - brukes for å gjemme høyre sidepaneler hvis bestemt i Hovedinnstillinger.

CSS EKSEMPEL MED FORKLARING

Kommentarer
1 #1 Kenneth
den 01. juli 2008 21:14
Finnes det en "default" css fil som inneholder alt det nødvendige? Det tror jeg hadde vært kjekt å ha Smile
6 #2 Sveinungs
den 01. juli 2008 21:20
Det kommer Wink
6 #3 Sveinungs
den 02. juli 2008 18:39
...og DER var 'default css' fil på plass.
1 #4 Kenneth
den 06. juli 2008 23:51
super dupert Smile
Skriv kommentar
Vennligst logg inn for å skrive kommentarer.
Vurderinger
Du må være registrert bruker for å kunne vurdere.

Du må logge inn for å kunne stemme.

Ingen vurderinger enda.
Logg inn
Brukernavn

Passord



Har du glemt passordet?
Spør om et nytt ved å klikke her.
Shoutbox
You must login to post a message.

14/02/2016 20:19
Usj ja, alt for stille Sad

30/01/2016 18:19
Veeeeeeeeeldig stille her

26/01/2016 10:23
Er vist noen som har satt i gang med oversettelse sies det

15/01/2015 20:36
Kommer det en norsk versjon er v9?

05/01/2015 00:22
Tiden går ja. Vi venter vel nå mest på siste versjon Smile

Donasjon
Betal med Paypal NOK





8,106,850 Unike besøk