ХТМЛ5 - Напредни стилови за табеле

У оквиру нових спецификација за ХТМЛ5 И ЦСС Постоји неколико стилова који се могу применити на табеле ради даљег дефинисања и прилагођавања њиховог понашања ономе што имамо као концепт у уму да бисмо наше странице или документе направили, елементи које можемо да модификујемо су ивице табела, руковање празним ћелијама, укључујући и распоред истог стола.
урушавање границе
Одређује како се рубове рукује у суседним ћелијама, вредности које ово својство може да претпостави су: колапс И засебан.
Помоћу овог својства можемо да контролишемо начин на који прегледач исцртава границе, хајде да видимо ову слику како прегледач то подразумевано рукује:

Примећујемо да је на столу исцртана граница, а у свакој ћелији исте исцртана је друга граница, што ствара ефекат двоструке ивице, хајде да видимо сада како са урушавање границе можемо да решимо ово питање.

 Пример 
 Резултати анкете о воћу из 2011. године 

 
 
Ранк
Иам
Боја
 
Величина и гласови
 

 

 

 
 
Омиљено:
Јабуке
Зелен
 
Средње
500
 

 
 
2. омиљена:
Наранџе
Оранге
 
Велики
450
 

 

 
 
 Фруит Дата Ентерприсес
 

 

 

Хајде да видимо шта овај код генерише у прегледачу пре него што наставимо са објашњењем:

Вриједност скупљања коју постављамо у својство бордер-црасп говори нам да не желимо да се на сваком сусједном елементу исцртава ивица, што ствара ефекат који смо видјели на претходној слици.
Постављање одвојених ивица
Ако уместо коришћења колапс користимо засебну подразумевану вредност својства обруба граница, можемо користити додатна својства попут размак између граница Да бисмо дефинисали простор између ивица суседних елемената, погледајмо пример:

 Пример 
 Резултати анкете о воћу из 2011. године 

 
 
Ранк
Иам
Боја
 
Величина и гласови
 

 

 

 
 
Омиљено:
Јабуке
Зелен
 
Средње
500
 

 
 
2. омиљена:
Наранџе
Оранге
 
 

 

 
 
Фруит Дата Ентерприсес
 

 

 

У овом примеру једноставно прецизирамо да ће ивица имати простор од 10 пиксела за суседне елементе, да видимо пример како се ово преводи у прегледач:

Руковање празним ћелијама
Као што смо видели на претходној слици, прегледач такође додељује простор са ивицом за празне ћелије, што понекад можда не желимо у нашој табели, па можемо да извршимо следећу измену претходног кода како бисмо могли да се носимо са празним ћелијама ћелије.

Хајде да видимо како ово изгледа у прегледачу:

Заиста, успели смо да се решимо празних ћелија без губитка формата наше табеле.
Овим завршавамо водич, као што видимо, можемо направити много измена у нашим табелама како бисмо их прилагодили ономе што можемо замислити и прилагодити нашим потребама.Да ли вам се допао и помогао овај водич?Можете наградити аутора притиском на ово дугме да бисте му дали позитиван поен