Dış görünüşün ardında ne yattığına bir bakın
![]() | |||||||||||||
![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | |||||
![]() | Bu gerçekten çok daha kolay bir şekilde yapılabilirdi. | ![]() | ![]() | Tahmin edin bu küçük tablo içerisinde ne kadar işaretleme var? 13.7k. Bu şeyin içinde 17 satır ve 9 kolon var. Ve tüm ayırıcı GIFlerden bahsettim mi? | ![]() | ||||||||
![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ||||||||
![]() | |||||||||||||
![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | |||||
![]() | Burda bir sürü tablo hücresi ve ayırıcılar var. | ![]() | ![]() | Ve tüm bu noktalı kenarlar bir background özelliği ile yapıldı, ki bu onaylanmayacaktır.
| ![]() | ||||||||
![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ||||||||
![]() | |||||||||||||
![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | |||||
![]() | Bunların hepsi 8 tablo hücresi ve 4 CSS kuralı ile yapılabilirdi. | ![]() | ![]() | Cidden. 8 hücre ve 4 css kuralı, tüm gereken bu kadar.
| ![]() | ||||||||
![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ||||||||
![]() | |||||||||||||
![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | ![]() | |||||
![]() | <table> için bir tane, <td> için bir tane, <ul> için bir tane ve <li> için bir tane kurala ihtiyacınız var. | ![]() | ![]() | Bu kadar. Bunları yaptığınız takdirde paha biçilmezsiniz.
| ![]() | ||||||||
![]() | ![]() | ![]() | ![]() | ![]() | |||||||||
![]() |
Tablo yapısını gösteren kod:
table { margin: 3px; padding: 2px; border: solid 2px blue }
td { padding: 2px; border-style: solid; border-width: 1px; border-color: gray gray silver silver }