 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
||||||||||||||||
 |
|
||||||||||||||||||||||||||||||
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
|
||||||||||||||||||||
|
CSS priručnik
CSS Tutorial CSS Priručnici CSS Tutorial Uvod 1. Umetanje 2. Background... 3. Selectori 4. Margin... 5. Fonts 6. Text 7. Tablice 8. Popis 9. Positioning 10. Napredno CSS Elementi Kontaktirajte nas... Naručite CD |
CSS Tutorial 7. Table - TablicaTablice se mnogo koriste u HTML-u. Tablice mogu biti jednostavne ili pak složene. Postoji mnogo style elemenata no spomenut ćemo samo one najosnovnije. Za primjer je uzeta tablica koja koristi dosta style elemenata koji su prethodno objašnjeni. Ukoliko niste baš u "formi" sa tablicama pogledajte naš priručnik.7.1 Primjer tablice
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html> <head> <title>Naslov</title> <style type="text/css"> body { background:#000000; color:#ffffff } table { border: yellow solid 7px; background:#000000; color:#ffffff } caption { background:#000000; color:#ffffff; text-align: center; padding-bottom:10px; font-weight:bold } th { border-bottom: yellow 3px solid; text-align:center; font-weight:bold; font-size:25px; padding-top:15px; padding-bottom:15px } td { background:#000000; text-align:left; font-style:italic; color:yellow; padding-left:15px } td.green { border:lime groove 10px } td.purple { background:#800080; color:#ffffff; text-align:left; font-family:Verdana, Arial, Serif; font-size:11px } td.minus18 { border:#FFC001 double 8px; text-decoration:underline } </style> </head> <body> <table border="1" width="50%" cellpadding="5" cellspacing="0"> <caption>(green border=female, orange border=minus 18)</caption> <tr> <th>Ime</th> <th>Godina</th> </tr> <tr> <td>John</td> <td>35</td> </tr> <tr> <td class="green">Mary</td> <td>30</td> </tr> <td class="purple" colspan= "2">Mark: još čeka informacije</td> </tr> <td>Nick</td> <td class="minus18">14</td> </tr> <tr> <td>Eric</td> <td>58</td> </tr> <tr> <td>Willy</td> <td>22</td> </tr> <tr> <td class="green">Ann</td> <td class="minus18">11</td> </tr> </table> </html> Dat će nam tablicu:
Kao što vidite mogu se upotrijebiti svi style elementi it prethodnih lekcija. Najbolje je da tablice budu što jednostavnije kako bi korisnicima blie što prihvatljivije i ne baš kičaste kao u ovom našem primjeru. NAPOMENA : Postoji standardni način centriranja tablice u CSS-u ali to podržava samo Netscape 6. Ukoliko ju želite centrirati stavite ovo u vaš Style Sheet: table { margin-left:auto; margin-right:auto } Budući da Internet Explorer 5.5 ovo ne podržava uradite to ovako:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html> <head> <title>Naslov</title> <style type="text/css"> body { background:#000000; color:#ffffff } .center { text-align:center } </style> </head> <body> <div class="center"> <table> <tr> <th>neki text</th> <td>nekitext</td> </tr> </table> </div> </html> Samo stavite <div class="center"> tag. U Style Sheet-u definiran je class .center { text-align:center }. I a je to! |
 |
|
||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||
 |
|
||||||||||||||||||||||||||||||
 |
Text Oglasi Foto Oglasi Besplatne Stvari Besplatan Web Hosting Web Direktorij Dizajn |  |
|
||||||||||||||||||||||||||||
 |
|
||||||||||||||||||||||||||||||