n · k · m

Jokainen rekisteröitynyt käyttäjä voi muokata sivun ulkoasua, tekstin kokoa ja tyyliä, värejä, reunuksia ja paljon muuta. Muutokset tehdään CSS-tiedostoihin, jotka ovat oman käyttäjäsivun alasivuja.

Yleistä

muokkaa

Jokainen käyttäjä voi valita oman valmiin ulkonäön asetuksista. Jokaiselle ulkonäölle on sitä vastaava oletus-CSS. Suomenkielisessä Wikipediassa ne löytyvät osoitteista:

Lisäksi on Järjestelmäviesti:Common.css ja Järjestelmäviesti:Mobile.css, jotka sisältävät kaikille ulkoasuille yhteisiä tyylejä työpöytä- ja mobiilinäkymissä.

Omat muutokset voit laittaa käyttäjäsivusi alasivuille, esimerkiksi Vector-ulkoasulle Käyttäjä:Omatunnus/vector.css.

Tällä sivulla esikatselussa osa tyylien vaikutuksista näkyy heti. Ei kuitenkaan kaikki. Tallentamisen jälkeen muista ladata sivu uudelleen, jotta saat uuden tyylitiedoston.

Esimerkkejä

muokkaa
/* välilehtien ja sisältöalueen taustavärin muuttaminen */
#content, #content table
#p-cactions ul li a { background: #f5f5f5; }

/* sivuston taustavärin muuttaminen */
body { background: Purple; }

/* pre-alueiden värien muuttaminen */
pre { background: White }

/* logon vaihtaminen */
#p-logo a { background: url(http://en.wikipedia.org/upload/wiki.png) 35% 50% no-repeat !important; }

/* logon poistaminen */
#p-logo { display: none }
#column-one { padding-top: 0; }

/* tunnuksen vieressä sijaitsen kuvan poistaminen */
li#pt-userpage { background: none }

/* käytä selaimen asetuksia tekstin koolle ja fontille */
body, #globalWrapper { font: inherit !important; }

/* alleviivaa linkit aina */
a { text-decoration: underline; }

/* vaihda valitsemattomien välilehtien väriä */
#p-cactions ul li a { background: #C7FDC7; }

/* vaihda valittujen välilehtien väriä */
#p-cactions ul li.selected a { background: white; }

/* vaihda valittujen välilehtien reunusten väriä */
#p-cactions li.selected { border-color: #aaaaaa; }

/* normaalit värit linkeille */
a { color: #0000FF; }
a:visited { color: #7F007F; }
a:active, a.new { color: #FF0000; }
a.interwiki, a.external { color: #3366BB; }
a.stub { color: #772233; }

Pyöreät kulmat

muokkaa
#p-cactions ul li, #p-cactions ul li a {  
  border-top-left-radius: 1em;
  border-top-right-radius: 1em;
}
#content { 
  border-top-left-radius: 1em;
  border-bottom-left-radius: 1em;
}
div.pBody {
  border-top-right-radius: 1em;
  border-bottom-right-radius: 1em;
}

Suomenkielisen Wikipedian erikoisuudet

muokkaa
  • Muokkaustilan alapuolella olevan työkalupalkin tunnus on fiwiki-bottom-toolbar
  • Muokkaustilassa olevien erikoismerkkien luokka on fiwiki-special-character
  • Muokkaustilassa olevien muiden painikkeiden luokka on fiwiki-feature
  • Osa muokkaustilassa olevista merkeistä on oletuksena piilotettu:
  1. fiwiki-special-character-comment - <!-- * -->
  2. fiwiki-special-character-ae - æ ja Æ
  3. fiwiki-special-character-ostroke - ø ja Ø

Esimerkkejä

muokkaa
/* Työkalupalkin piilottaminen */
#fiwiki-bottom-toolbar { display:none; }

/* Erikoismerkkien koon suurentaminen */
.fiwiki-special-character {
  font-size: 150% !important;
  font-weight:bold;
}

/* Kaikkien erikoismerkkien näyttäminen */
#fiwiki-special-character-comment,
#fiwiki-special-character-ae,
#fiwiki-special-character-ostroke {	
display: inline !important;	
}

Esimerkkityylejä

muokkaa

Simppeli

muokkaa
 
Simppeli käytössä

Pyöristykset onnistuvat luultavasti vain mozilla-selaimilla.

Asiasta muualla

muokkaa