Brukere online

· Gjester online: 3

· Medlemmer online: 0

· Antall medlemmer: 593
· Siste medlem: Reime

Sist Sette Brukere

· Kenneth02:58:09
· Ikkenoe16:52:53
· Henning-L 2 dager
· Pippi 5 dager
· nettbull 5 dager
· ponas 5 dager
· quiki 6 dager
· espenbg 1 uke
· Ridder7 1 uke
· fjodork 1 uke

Fødselsdager

grovn09 Sept
helmuth10 Sept
Nidhoggr14 Sept
wolf16 Sept
Nilsen21 Sept
KurdishCNN22 Sept
Snopmaster27 Sept
allan28 Sept
seppolaatle07 Okt
sebaldus12 Okt

Logg inn

Brukernavn

Passord



Ikke medlem enda?
Klikk her for registrering.

Glemt passordet?
Få nytt ved å klikke her.

Temaskifter

Skift til:

Replikkboks

Du må logge inn for å skrive her.

06.09.2010 23:29
Problemer kan oppstå alle steder. Regner med at Web10 har en løsning Smile

06.09.2010 22:42
hmmm kenneth kansje bytte til noe annet he he he Grin he he jeg er fornøyd med properhost.net du kan jo ta en titt der.

06.09.2010 22:28
Hmm, tabellen _settings_ kræsjet igjen. Lurer på hva Web10 holder på med Angry

03.09.2010 08:20
Good work Kenneth Smile

03.09.2010 02:21
Ja så kjører vi igjen Smile Var bare en av tabellene som hadde kjørt ut i grøften, men jeg fikk den opp på veien igjen Grin

Donasjon

Betal med Paypal NOK





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.004 sekunder, ved hjelp av GeSHi 1.0.7.20


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

GeSHi: CSS
  1. /* STANDARD V7 CSS */
  2. /* Lenker */
  3. a { color: #04688d; text-decoration: none; }
  4. a:hover { color: #04688d; text-decoration: underline; }
  5.  
  6. /* Lenker i Sidepaneler */
  7. a.side { color: #555; text-decoration: none; }
  8. a:hover.side { color: #f6a504; text-decoration: underline; }
  9.  
  10. /* Hovedbakgrunn for siden, tekstfarge og størrelse hvis ikke spesifisert andre steder */
  11. body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #000; background: #FFF; margin: 5px;}
  12.  
  13. /* Horisontale linjer */
  14. hr, hr.side-hr { height: 1px; border: 1px solid #EEE; }
  15.  
  16. pre, code { font: 10px monospace; }
  17.  
  18. .alt { color: #04688d; }
  19.  
  20. form { margin: 0px; }
  21.  
  22. /* Knapper */
  23. .button { font: 10px Verdana, Arial, Helvetica, sans-serif; color: #FFF; background-color: #f6a504; border: 1px solid #000; padding: 5px; margin-top: 2px; }
  24.  
  25. /* BBKoder */
  26. .bbcode { font: 10px Verdana, Arial, Helvetica, sans-serif; color: #000; background-color: #eee; border: 1px solid #ccc; margin-top: 2px; }
  27.  
  28. /* Tekstbokser */
  29. .textbox { font: 10px Verdana, Arial, Helvetica, sans-serif; color: #555; background-color: #f8f8f8; border: 1px solid #ccc;}
  30.  
  31. /* Kollonne med VENSTRE sidepaneler inkludert BREDDE */
  32. .side-border-left { color: #777; background-color: #FFF; padding: 10px; width: 175px; }
  33.  
  34. /* Kollonne med HØYRE sidepaneler inkludert BREDDE */
  35. .side-border-right { color: #777; background-color: #FFF; padding: 10px; width: 175px; }
  36.  
  37. /* Nyhets-kategori bilde posisjon osv. */
  38. .news-category { margin: 3px 5px 0 0; float: left; }
  39.  
  40. /* Tabeller - viktig for bl.a. LAFT-Panel og Forum */
  41. td { font: 11px Verdana, Arial, Helvetica, sans-serif; }
  42. .center { margin: 0 auto; }
  43. .tbl-border { border: 1px solid #e1e1e1; }
  44. .tbl { font-size: 11px; color: #555; background-color: #fff; padding: 4px; }
  45. .tbl1 { font-size: 11px; color: #555; background-color: #fff; padding: 4px; }
  46. .tbl2 { font-size: 11px; color: #555; background-color: #f1f1f1; padding: 4px; }
  47. .forum-caption { font-size: 11px; font-weight: bold; color: #888; background-color: #f1f1f1; padding: 2px 4px 4px 4px; }
  48.  
  49. /* Sitert tekst */
  50. .quote { font-size: 11px; color: #555; background-color: #f8f8f8; padding: 4px; margin: 0px 20px 0px 20px; border: 1px solid #bbb; }
  51.  
  52. /* Søyle for avstemming */
  53. .poll { height: 12px; border: 1px solid #bbb; }
  54.  
  55. .comment-name { font-weight: bold; color: #04688d; }
  56.  
  57. /* REPLIKKBOKS */
  58. .shoutboxname { font-weight: bold; color: #04688d; }
  59. .shoutbox { color: #777; }
  60. .shoutboxdate { font-size: 10px; color: #888; }
  61.  
  62. /* SMALL */
  63. .small { font-size: 10px; }
  64. .small2 { font-size: 9px; }
  65. .side-small { font-size: 10px; color: #555; }
  66. .side-label { color: #555; background-color: #f1f1f1; margin: 2px 0; padding: 2px;}
  67.  
  68. /* CSS NAVIGERINGSPANELET */
  69. #navigation h2 { font-size: 10px; background-color: #F1F1F1; margin: 0; padding: 4px; }
  70. #navigation ul { margin: 0; padding: 0; list-style-type: none; }
  71. * html #navigation ul li { height: 1%; }
  72. #navigation a { display: block; color: #555; padding: 2px; text-decoration: none; }
  73. #navigation a:hover { color: #fff; background-color: #f6a504; }
  74.  
  75. /* SIDENAVIGERINGEN */
  76. .pagenav { padding: 4px; }
  77. .pagenav span { color: #fff; background-color: #f6a504; border: 1px solid #ddd; padding: 2px 4px 2px 4px; margin: 2px; }
  78. .pagenav a { color: #555; background-color: #f1f1f1; border: 1px solid #ddd; padding: 4px; margin: 2px; text-decoration: none; }
  79. .pagenav a:hover { color: #fff; background-color: #f6a504; margin: 2px; text-decoration: none; }
  80.  
  81. /* HJELPERE */
  82. img{ border: 0px;}
  83.  
  84. /* TinyMCE Spesifikk hjelpere */
  85. body.mceContentBody { background: #FFF; color: #000; }
  86. .mceContentBody a { color: blue !important; }
  87.  
  88. /* Meldinger som krever oppmerksomhet */
  89. .admin-message { font: 11px Verdana, Arial, Helvetica, sans-serif; text-align: center; color: #555; background-color: #F6F6F6; border: 1px solid #E1E1E1; padding: 3px; margin-bottom: 5px; }
Parset på 0.093 sekunder, ved hjelp av GeSHi 1.0.7.20

Kommentarer

#1 | Kenneth den 01. juli 2008 22:14
Finnes det en "default" css fil som inneholder alt det nødvendige? Det tror jeg hadde vært kjekt å ha Smile
#2 | Sveinungs den 01. juli 2008 22:20
Det kommer Wink
#3 | Sveinungs den 02. juli 2008 19:39
...og DER var 'default css' fil på plass.
#4 | Kenneth den 07. juli 2008 00:51
super dupert Smile

Skriv kommentar

Vennligst logg inn for å skrive kommentarer.

Vurderinger

Du kan bare vurdere om du er medlem.

Logg inn eller registrer deg for å vurdere.

Ingen vurderinger er foretatt enda.
Generert på: 3.91 sekunder
2,705,249 Unike besøk