Ulkoasun koodaaminen

Ilmoitathan Howrsessa yksityisviestitse Rebecalle, jos koodi ei toimi tai et vain saa sitä toimimaan, autan parhaani mukaan!

KOPIOIMINEN LUVATTA JA JAKAMINEN OMANAAN ON EHDOTTOMASTI KIELLETTY!!

Tämä opastus löytyy luvallisesti kopioituna vain osoitteesta http://kultaisten.blogspot.fi/
Jos näet jossain tämän kopioituna, ilman että siitä mainintaa täältä löytyy, ilmoita joko ♣ Banana ♣ :lle tai Rebecalle asiasta.


Jos haluat lisätä tämän koodiopastuksen omaan grafiikkablogiisi, lähetä siitä viestiä Rebecalle.




Koodia voit käyttää pohjana omalle ulkoasullesi, mikäli se helpommalta tuntuu. Olisi myös erittäin hyvä jos ilmoittaisit koodipohjan tekijän valmiissa ulkassasi, esim. "Koodinpohja © Rebeca".


<div style="width: XXXpx; height: XXXpx; margin: auto; text-align: center; background-color: XXX; background-image: url(XXX); top: 0px; left: 0px;">

<div style="width: XXpx; height: XXpx; margin-top: XXpx; margin-left: XXpx; text-align: left/center/right; font-size: XXpx; font-family: XX; color: XX; float: left; overflow: auto;">

LAATIKON TEKSTIT
</div>
</div>



Osien merkityksiä:
Width = ulkoasun leveys (merkitään X-merkkien kohdalle.)
Height = ulkoasun korkeus (merkitään X-merkkien kohdalle.)

background-color = ulkoasun taustan väri (mikäli haluat taustalle vain kuvan, laita X-merkkien kohdalle esim. #000 [musta])
backgroung-image = taustalle tuleva kuva, se merkitään kaarisulkujen sisälle. Älä ota sulkujen edessä olevaa "url" merkintää pois!
width = laatikon leveys
height = laatikon korkeus
margin-top = laatikon ensimmäisen tekstirivin sijainti ulkoasun yläraunasta.
margin-left = laatikon reunan sijainti vasemmasta reunasta.

text-align = tektin tasaus, eli onko se keskellä (center), vasemmalla (left) vai oikealla (right)
font-size = kirjaimien koko laatikossa, kannattaa käyttää esim 11px, mikä on normaali kirjaisinkoko.
font-family = fontti, kannattaa valita esim. jokin seuraavista: Tahoma, Arial, Verdana, Segoe Print
color = tekstien väri, esim. black (musta) tai HTML-merkinnällä #000
float = laatikon sijainti, kannattaa aina pitää vasemmalla (left)
overflow: auto = laatikon rullauspalkki, kannattaa laittaa joka laatikkoon, vaikka sitä ei välttämättä tarvitsikaan


Laatikoita voit lisätä liittämällä laatikon koodin toisen kerran, muista muokata koodin arvoja, niin että laatikko asettuu paikolleen, mitä enemmän laatikoita on, sen enemmän on laskeskeltavaa. Aina edes oikeat arvot eivät laita laatikkoa oikealle kohdalle, silloin täytyy muokata koodia niin, että ne asettuvat paikoilleen, se vaatii hieman kärsivällisyyttä mutta on helpompaa kuin uskotkaan!

Googlen kuvahausta EI SAA OTTAA KUVIA, sillä läheskään kaikkea siellä olevaa ei saa jakaa tai käyttää kaikkialla! Tekijänoikeudet siis pitävät olla kunnossa ettei grafiikkasi rikkoisi lakeja ja Howrsen sääntöjä. Kuvanmuokkaus vaiheessa kannattaa lisätä tekijä ja kuvan tekijä/ottaja sekä kuvan alkuperäinen osoite. Myös laatikoiden taustat kannaa lisätä, jotta siitä saa huolitellumman näköisen.



Värien hex-arvoja, eli niitä koodeja, joita laitetaan esimerkiksi tekstin väri kohtaan:

MUSTA: #000000
VALKOINEN: #ffffff
TUMMANPUNAINEN: #610000
TUMMANSININEN: #050044
TUMMANHARMAA: #2a2a2a
VAALEANHARMAA: #949494
BEIGE: #bab883