[es] - Prvi put bez tabela

pancevac2006

Član broj: 120316
Poruke: 559
*.adsl.beocity.net.

+1 Profil

^{08.02.2008. u 15:37 - pre 197 meseci}

Mnogo tema sam procitao kako je css+div-ovi sistem mnogo bolji od sistema sa tabelama.

Procitao sam na W3Schools o css (to mi je manje nepoznato) i o div pozicioniranju pa sam napravio nesto kao kostur za sajt.
Usput sam procitao i o XHTML pa me zanima da neko "preleti" ovaj moj kostur i napise da li sam dobro ukapirao sistem i da li je dobro odradjen XHTML.

Ovaj kostur mozete pogledati na http://www.besplatne-sms-poruke.info/css/

Hvala

Odgovor na temu

bantes9
Beograd

Član broj: 119554
Poruke: 1058
91.150.107.*

+39 Profil

Re: Prvi put bez tabela

^{08.02.2008. u 15:58 - pre 197 meseci}

Generalno nije lose s'obzirom da si u postupku ucenja pozicioniranja i stilizovanja stranica pomocu css-a.

Prva stvar koju bi mogao da promenis je da za opis glavnih delova stranica koristis id (#) umesto class. U tvom slucaju container, header. left, content, footer.
Klase koristi za recimo menjanje izgleda teksta, linkova, naslova (h1, h2, h3), izgleda celije neke tabele.

Neku klasu tipa .plavitekst ces moci da upotrebljavas na vise mesta gde god budes zeleo da ti tekst poprimi osobine te klase, dok ces id tipa #sadrzaj imati samo jedan i neces moci da primenis na jos neki deo stranice. id-evi su u principu jedinstveni i svaki od njih se odnosi na jednu jedinu stvar, dok jedna klasa moze pojaviti na vise mesta i opisati nekoliko elemenata.
Nadam se da si ukapirao sta sam hteo da kazem a ako bude trebalo jos neko detaljnije objasnjenje, slobodno reci.

P.S. Ako koristis Firefox mozes instalirati dodatak pod nazivom web developer (https://addons.mozilla.org/en-US/firefox/addon/60) pomocu kojeg ces moci da pogledas css nekog sajta ciji ti se izgled svidja i zajedno sa kodom koji ti je dostupan mozes dosta nauciti i neke stvari ce ti sigurno biti jos jasnije kada sve to vidis u praksi.

_{[Ovu poruku je menjao bantes9 dana 08.02.2008. u 17:16 GMT+1]}

Mrav radi, tegli, i od njega nije postalo ništa,
a majmun se zezao po drveću i od njega je postao čovek.

Brana Crnčević

Odgovor na temu

pancevac2006

Član broj: 120316
Poruke: 559
*.adsl.beocity.net.

+1 Profil

Re: Prvi put bez tabela

^{08.02.2008. u 16:13 - pre 197 meseci}

Nešto kao, id-ovi su generalniji od klasa.
Odmah cu to da probam pa cu postaviti da vidis da li sam skapirao.

Odgovor na temu

pancevac2006

Član broj: 120316
Poruke: 559
*.adsl.beocity.net.

+1 Profil

Re: Prvi put bez tabela

^{08.02.2008. u 16:43 - pre 197 meseci}

Postavio sam ispravljenu verziju pa ako mozes izvrsi inspekciju.

Zbog cega je sve ovo bolje od tabela?
Ja ovo (vizuelno) odradim i sa tabelama.

Odgovor na temu

bantes9
Beograd

Član broj: 119554
Poruke: 1058
91.150.107.*

+39 Profil

Re: Prvi put bez tabela

^{08.02.2008. u 17:15 - pre 197 meseci}

U okviru div-a pises samo id bez class, malo sam izmenio tvoj kod i dodao jos neke stvari, pa se nadam da ces sada sve pohvatati.

Code:

<body>

<div id="container">
<div id="header"></div>

<div id="traka">Traka ispod headera</div>
<div id="left">
/*meni u vidu sredjene liste*/
<ol id="linkovi">
        <li class="nekaklasa"><a href="#">fdfdfdfd</a></li>
        <li>class="nekadrugaklasa"><a href="#">fdfdfdf</a></li>
        <li><a href="#.html">sfdsfs</a></li>
        <li><a href="#>fdff</a></li>
        <li><a href="#">dfdfdfdf</a></li>
        <li class="poslednjaklasa"><a href="#">fdfdfdf</a></li>
    </ol>
</div>
<div id="content">
/*recimo definises h1,h2,h3 {color:#000000;font-size: 1.5em;} */
<h1>dfsdfsdf</h1>
/*paragraf mozes kao p {color:#000000;font-size: 1.5em; margin: 0 0 1em 0;}
<p>fdfdfdfdfdfdf
</p>
</div>
<div id="footer">Copyright 2007 by JA</div>
</div>
</body>

Posto vidim da imas adsl, sa neta mozes da skines prilicno dobre video tutoriale(html, css, site disign), pomocu kojih ces najlakse pohvatati sve cake.

Moze i pomocu tebela sve ovo da se uradi ali mislim da je lakse pomocu css-a, kao i kasnije ispravke koje se rade a i samo ucitavanje stranice je brze na ovakav nacin.

Mrav radi, tegli, i od njega nije postalo ništa,
a majmun se zezao po drveću i od njega je postao čovek.

Brana Crnčević

Odgovor na temu

pancevac2006

Član broj: 120316
Poruke: 559
*.adsl.beocity.net.

+1 Profil

Re: Prvi put bez tabela

^{08.02.2008. u 17:44 - pre 197 meseci}

Znaci ovako, majprostije sto moze to bi izgledalo ovako, ako se ne varam:

Code:
<body>
<div id="container">
  <div id="header">Content for  id "header" Goes Here</div>
  <div id="traka">Content for  id "traka" Goes Here</div>
  <div id="left">Content for  id "left" Goes Here</div>
  <div id="content">Content for  id "content" Goes Here</div>
  <div id="footer">Content for  id "footer" Goes Here</div>
</div>
</body>

a posle ja mogu meni da stavim kao java skriptu ili bilo sta drugo tamo gde mislim da je mesto.

Jesam u pravu?

Odgovor na temu

bantes9
Beograd

Član broj: 119554
Poruke: 1058
91.150.107.*

+39 Profil

Re: Prvi put bez tabela

^{08.02.2008. u 19:07 - pre 197 meseci}

To je to, s'tim sto ne moraju svi id-evi da budu u sklopu container-a vec samo recimo id=content i id=left. Id mozes da upotrebis jos neki put ako recimo imas u lefom delu deo sa pretragom, neku formu a onda unutar toga pomocu class-a definises boje pozadine, slova, margine i padding.
Nadji one video tutoriale i za par dana ces pohvatati vecinu bitnih stvari.

Mrav radi, tegli, i od njega nije postalo ništa,
a majmun se zezao po drveću i od njega je postao čovek.

Brana Crnčević

Odgovor na temu

pancevac2006

Član broj: 120316
Poruke: 559
*.adsl.beocity.net.

+1 Profil

Re: Prvi put bez tabela

^{08.02.2008. u 19:20 - pre 197 meseci}

Sto znaci da mogu da napravim neki id koji cu koristiti za adsense reklame i njega mogu da stavim na sredinu stranicu oko koje ce teci tekst?

Odgovor na temu

bantes9
Beograd

Član broj: 119554
Poruke: 1058
91.150.107.*

+39 Profil

Re: Prvi put bez tabela

^{09.02.2008. u 00:07 - pre 197 meseci}

Upravo tako pomocu id-a a ostala sitnija podesavanja mozes pomocu neke klase (boja pozadine, boja slova...). Znaci id-em definises velicinu pravugaonika i polozaj a slova i ostalo uredjujes class-om.

Mrav radi, tegli, i od njega nije postalo ništa,
a majmun se zezao po drveću i od njega je postao čovek.

Brana Crnčević

Odgovor na temu