[es] - Početničke smernice i saveti

snake_master
Čačak

Član broj: 18087
Poruke: 402
*.ptt.rs.

Sajt: Trenutno nemam:)

+2 Profil

^{03.12.2008. u 00:51 - pre 187 meseci}

Učim CSS kod pa kako svaki put saznajem nešto novo, setih se da postavim pitanje ili zatražim savet.

Interesuje me na šta bi trebalo da se obrati pažnja pošto se savladaju osnove CSS, da li postoji neki savet ili smernica kako proučavati kod dalje...
Naime, naišao sam na tekstove gde savetuju da bi napočetku trebalo upisati ovakav kod:

Code:
* {margin: 0; padding: 0; border: 0;}

jer browseri imaju različite vrednosti sa html elemente a ovaj kod vraća vrednost svih elemenata na 0, pa mi se dogodilo kada sam prvi put rešio da rasporedim divove, da div "content" beži od div "header" i to sve zahvaljujući elementu <H1> koga sam imao na početku diva "content" pa mi je predhodni savet dosta pomogao...

(Isto sam negde pročitao) tipa da nad "floatovanim" objektima nije preporučljivo koristit margine.

E sad koji su to najvažniji saveti ili smernice koje bi vi dali, na šta treba posebno obratiti pažnju???

Nadam se da sam bio jasan...

Hvala!

Odgovor na temu

Aleksandar Ružičić
Software Architect, Appricot d.o.o.
Beograd

Član broj: 26939
Poruke: 2881

Jabber: krckoorascic@gmail.com
Sajt: krcko.net

+44 Profil

Re: Početničke smernice i saveti

^{03.12.2008. u 14:07 - pre 187 meseci}

sto se tice resetovanja stilova (to *{margin:0...) pogledaj ovaj post: http://www.elitesecurity.org/p2126418

a sto se tice tog saveta da ne treba koristiti margine na floatovanim elementima, to je zbog ie6 (inace je sasvim ok da koristis margine na flaotovanom elementu, po css standardu) koji ima double-margin bug, tj ako nekom elementu stavis float: left; margin-left: 5px; u svim browserima ces dobiti levu marginu od 5 pixela a ie6 ce da prikaze marginu od 10px (ovo su sredili u ie7), isto vazi i ako je desni float + desna margina...

a sto se tice smernica i saveta preporucujem ti da procesljas ove sajtove:

http://www.alistapart.com
http://www.positioniseverything.net
http://www.quirksmode.org/css/contents.html
http://www.csszengarden.com
http://www.google.com

rafforum.rs - Forum Računarskog Fakulteta

Odgovor na temu

snake_master
Čačak

Član broj: 18087
Poruke: 402
*.ptt.rs.

Sajt: Trenutno nemam:)

+2 Profil

Re: Početničke smernice i saveti

^{03.12.2008. u 23:34 - pre 187 meseci}

Još jedno pitanje: Kako testirati izgled stranice u svim browserima? Jel postoji neka stranica na webu gde se kod može prebaciti pa da se proveri kako to radi sa različitim browserima, ili da instaliram što više browsera kod mene?

Skinuo sam neke preinstalled verzije IE 5.0, 5.5, 6.0 a već imam instaliran IE 7 i Mozillu. Da li da tražim na netu preinstalled Opera i Safari, jer me nervira, da mi budu instalirano 10 browsera na sistemu ... pa da tako proveravam izgled stranice...

Odgovor na temu

Aleksandar Ružičić
Software Architect, Appricot d.o.o.
Beograd

Član broj: 26939
Poruke: 2881

Jabber: krckoorascic@gmail.com
Sajt: krcko.net

+44 Profil

Re: Početničke smernice i saveti

^{04.12.2008. u 03:48 - pre 187 meseci}

evo sta ja imam instalirano od browsera: ie6, ie8b2 (mada u svim stranicama forsiram ie8 da se ponasa kao ie7), najnovije verzije firefoxa, safarija, opere i chrome-a, to na windowsu, a na macu imam najnovije verzije firefoxa, opere i safarija...

postoji i browsershots.org ali je mnogo brze kada imas browsere "pod svojom rukom"...

rafforum.rs - Forum Računarskog Fakulteta

Odgovor na temu

snake_master
Čačak

Član broj: 18087
Poruke: 402
*.ptt.yu.

Sajt: Trenutno nemam:)

+2 Profil

Re: Početničke smernice i saveti

^{14.12.2008. u 20:21 - pre 187 meseci}

Da ne bih otvarao novu temu, ako moze neko da mi razbije jednu nedoumicu:
Naime intezivno radim neke primere navigacionih lista, i sve ok odradim za Mozillu, ali kada probam IE širina tog elementa je veća e sad evo kako sam ja to rešio i dobio skoro isti prikaz ali i dalje nije identičan, čak mislim da visina takođe nije ista, čini mi se da su <li> elementi "višlji" na FF nego na IE, možda grešim u celom pristupu stvari:

HTML

Code:

<div id="navcon">
<ul id="nav">
    <li id="active"><a href="#">link1</a></li>
    <li><a href="#">link2</a></li>
    <li><a href="#">link3</a></li>
    <li><a href="#">link4</a></li>
    <li class="last"><a href="#">link5</a></li>
</ul>
</div>

CSS kod:

Code:

#navcon {
    width: 200px;
    background-color: #F4DA9B;
    _width: 170px; /*ovo sam stavio da bi IE video ovu veličinu, a 170px mi je palo na pamet zbog #nav {margin: 0 30px;} */
    padding: 0;
    margin: 0;
}

#nav {
    padding: 10px 0;
    list-style-type: none;
    margin: 0 30px;
}
li#active a {
    background-color: #F4DA9B;
    color: #993300;
}
#nav a {
    display: block;
    background-color: #FAEEC7;
    text-decoration: none;
    border: 1px solid;
    border-color: #fff #999 #999 #fff;
    color: gray;
    padding: 0.25em 1em;
    _width: 99.99%; /* i ovo sam stavio zbog pravilnog prikaza <a> elementa ??? */
}
#nav a:hover {
    background-color: #F4DA9B;
    color: #993300;
    border: 1px solid;
    border-color: #999 #fff #fff #999;
}

Pokušavam istovremeno da učim CSS kod i da gledam da prikaz onoga što načinim bude pravilan u svim browserima (bar za sada FF i IE). Dvoumim se da li tako da nastavim, ili da učim prvo CSS a posle da savladam "cross-browser", ali sve je to povezano kad se na kraju sagleda :) :)

Odgovor na temu