~>&#

Babablogom

 
Beszlgessnk
 
Bejelentkezs
Felhasznlnv:

Jelsz:
SgSg
Regisztrci
Elfelejtettem a jelszt
 
Eddig
Induls: 2015-04-09
 
Kdok

Modulok fejlce

2015.04.10. 12:50, Enma22
Oldals s kzps

Ez az alap kd, de van a GPortalnak egy olyan CSS kdja, amiben van mg pr szmunkra rdekes sor.

Alap:

td.modtitle { /* modulok fejlce */
padding-left: 4px; 
font-size: 9pt; 
font-weight: bold; 
color: white; 
background-color: #686868; 
height: 19px
}
 
Az sszes modulra egyformn hat.
 
Ez pedig a szls s a kzps modulra vonatkozik:
.column_side,
.column_main {

 

A kdok sszevonhatak, gy egy ilyet tudunk krelni:

.column_side td.modtitle {

valamint

.column_main td.modtitle {

Ezek ugye kln stlust adnak a szls modulnak, s kln stlust a kzps modulnak.

Ami mg lnyeges, hogy magassgnak akkora mretet adj meg, amekkora a fejlcedben a kp, ha egyedit ksztesz mondjuk Photoshopban, vagy Photo Filtrben. s persze modul szlessgnek is.

Szls modulhoz van egy ilyen szpsges kis kdunk is:

.column_side {
    width: 160px;
}

Ez a szls modul szlessge.

.column_main {

width: 400px;}

Ez pedig a kzps.

Az alap kdbl kiindulva a padding azt hatrozza meg, hogy balrl mekkora kz legyen a modulok kztt, s ugye az oldal szltl.

A font-size egyrtelm, betmretet ad.

A font-weight adja meg, hogy flkvr vagy norml szveg legyen.

Amit mg megadhatunk:

font-family - bettpus

font-style - stlus, normal, vagy italic, ami dltet jelent

font-variant - normal vagy small-caps, azaz csupa nagybet, a nagybets szavak els betje nagyobb

Jhet a szn, ami a color, ide a kdgenertorral gykdhettek valamit.

Aztn lehet mg rnykot is adni neki.

text-shadow: 2px 2px 5px #000000;

Az els szm a horizontlis, a msodik a vertiklis, a harmadik szm pedig az elmoss, majd szn. ne legyen nagyon klnbz, mint az alap szn, mert vakthat.

Aztn mg egy kis extra a text-transform, amivel nagybetss, kisbetss, kapitliss is varzsolhatjuk, br annyira nem jellemz.

text-transform: uppercase vagy lovercase vagy capitalize;

Ami mg fontos, az a szveg helyzete, vagyis a text-align, ami center, left vagy right lehet.

A betk kz rakhatunk egy kis sznetet is, ezzel szthzva ket, ha gondoljuk.

letter-spacing: 2px;

Ha mnusszal rjuk, akkor pedig sszbb hzza ket.

Ennyit a szvegrl.

Jhet a httr, amit mr korbban taglaltunk a body rsznl, ugyan gy kell megadni itt is, ismtlst felesleges, ha elg nagy kpet vlasztottl, vagy nem kpet akarsz, hanem sima sznt. Amennyiben szerkesztett fejlced lesz, gy a magassghoz a kped magassgt add meg! Lsd lejjebb!

background-image: url(kep url); vagy

backgroung-color: #ededed;

Magassgot is meg lehet adni, valamint paddig-ot, hogy milyen tvolsgra legyen a szveg a szltl.

Magassg: height: 19px;

padding: 2px 2px 4px 3px;

Ez egyszerbb, mint mindet kln megadni, amgy ha bizonyos oldalakat akarunk, akkor padding-left, right, bottom, top.

Keretet is adhatunk neki, n nem szoktam rajta varilni, egyszer kerettel dolgozom.

border-bottom: 2px solid #000000;

border-top: 2px solid #000000;

border-left: ;

border-right: ;

Most nem rtam vgig, de olyan mretet, s sznt adsz neki, ami az oldalad dizjnjhoz megy.

Le is lehet ket kerekteni, itt is rengeteg varici van, a legegyszerbb ez:

border-radius: 2em 2em 3em 3em

Ki kell tapasztalni melyik szm melyik sarkot kerekti, lehet 0-t is berni, gy az nem lesz kerek.

Azt hiszem ennyi lenne.

Itt a kd egyben, ezt tudjtok varilni. Ha mindegyik modulnak ms fejlcet szeretntek, akkor tegytek el amit a cikk elejn is lertam.

td.modtitle { /* modulok fejlce */
padding-left: 4px; 
font-size: 9pt;
font-family: tahoma;
font-style: normal;
text-shadow: 2px 2px 3px #000000;
text-align: center;
backgroung-image: url(kepem.hu/kepem.jpg);
border-bottom: 1px solid #000000; 
font-weight: bold; 
color: #ffffff; 
background-color: ; 
height: 19px
}
Szlj hozz te is!
Nv:
E-mail cm:
Amennyiben megadod az email-cmedet, az elrhet lesz az oldalon a hozzszlsodnl.
Hozzszls:
Azrt, hogy ellenrzhessk a hozzszlsok valdisgt, krjk rd be az albbi kpen lthat szt. Ha nem tudod elolvasni, a frissts ikonra kattintva krhetsz msik kpet.
rd be a fenti szt: j CAPTCHA krse
 
Mg nincs hozzszls.
 
Friss
Friss bejegyzsek
2015.06.10. 11:16
2015.06.09. 18:03
2015.06.09. 17:53
2015.06.09. 13:30
2015.06.09. 12:46
2015.05.27. 15:21
2015.05.19. 16:37
2015.05.19. 15:39
2015.05.19. 15:33
2015.05.13. 10:40
Friss hozzszlsok
 

Mindig tudnod kell, melyik kikötõ felé tartasz. - ROSE HARBOR, a mi városunk - FRPG    *****    A boroszkányok gyorsan megtanulják... Minden mágia megköveteli a maga árát. De vajon mekkora lehet ez az ár? - FRPG    *****    Alkosd meg a saját karaktered, és irányítsd a sorsát! Vajon képes lenne túlélni egy ilyen titkokkal teli helyen? - FRPG    *****    why do all monsters come out at night - FRPG - Csatlakozz közénk! - Írj, és éld át a kalandokat!    *****    Aki szörnyekkel küzd, vigyázzon, nehogy belõle is szörny váljék. S ha hosszasan tekintesz egy örvénybe, az örvény vissza    *****    Rose Harbor, ahol a tenger suttog és a múlt sosem tûnik el teljesen. - FRPG - csatlakozz közénk te is :)    *****    Egy kikötõ, ahol minden hullám egy új kezdetet ígér. Rose Harbor, több mint egy város, egy világ a világ mögött.    *****    Rose Harbor &#8211; kisvárosi báj, nagy titkokkal - légy részese te is ennek a kalandnak :) - FRPG    *****    Óceán, erdõ, csillagfény &#8211; minden ösvény Rose Harborba vezet - aktív FRPG közösség    *****    Itachi Shinden 1. kötet Magyarul elérhetõ a konoha.hu -n. Nézzetek be! *** Itachi Shinden 1. kötet Magyarul elérhetõ!!!    *****    ÁGICAKÖNYVTÁRA - KÖNYVEK, KÖNYVEK, KÖNYVEK - ÁGICAKÖNYVTÁRA    *****    MOVIE-NIGHT -> Filmek, Sorozatok <- MOVIE-NIGHT    *****    Movie-    *****    Játssz a színekkel keress szebbnél szebb képeket, építs, szépítsd a portálod, hogy szebb és színesebb legyen a világod!    *****    Debrecen Huszti Lakóparki napelemes családiház eladó. 06209911123 Debrecen Huszti Lakóparki napelemes családiház eladó.    *****    Pont ITT Pont MOST! Pont NEKED! Már fejlesztés alatt is szebbnél színes szebb képek! Ha gondolod gyere less be!    *****    Kedves Csokoládé kedvelõk! Segítségeteket kérném a kérdõívem kitöltéséhez! Témája a CSOKOLÁDÉ MÁRKÁK! Köszön    *****    Homlokzati hõszigetelés! Vállaljuk családi házak, lakások, nyaralók és egyéb épületek homlokzati hõszigetelését!    *****    * Beugrós munkavállalók éjjel-nappal. * Beugrós munkavállalók éjjel-nappal. * Beugrós munkavállalók éjjel-nappal. *    *****    Elindult a Játék határok nélkül rajongói oldal! Ha te is szeretted a '90-es évek népszerû mûsorát, nézz be ide!