✅ HTML5 - uzlaboti stili tabulām

Satura rādītājs

Saskaņā ar jaunajām specifikācijām HTML5 Y CSS Tabulām var izmantot vairākus stilus, lai vēl vairāk definētu un pielāgotu to uzvedību tam, kas mums ir prātā, lai izveidotu mūsu lapas vai dokumentus, elementi, kurus mēs varam mainīt, ir tabulu malas, tukšu šūnu apstrāde, ieskaitot vienas un tās pašas tabulas izkārtojumu.
robeža-sabrukums
Norāda, kā robežas tiek apstrādātas blakus esošajās šūnās. Šī rekvizīta vērtības var būt šādas: sabrukt Y atdalīt.
Izmantojot šo īpašumu, mēs varam kontrolēt pārlūkprogrammas robežu zīmēšanas uzvedību. Apskatīsim šo attēlu, kā pārlūks to apstrādā pēc noklusējuma:

Mēs novērojam, ka uz galda tiek uzzīmēta robeža un katrā tās šūnā tiek ievilkta cita robeža, tas rada dubultās robežas efektu, tagad redzēsim, kā ar robeža-sabrukums mēs varam tikt galā ar šo jautājumu.

 Piemērs 
 2011. gada augļu aptaujas rezultāti 

 
 Rangs Yam Krāsa  Izmērs un balsis 

 

 

 
 Izlase: Āboli Zaļš  Vidējs 500 

 
 2. izlase: Apelsīni apelsīns  Liels 450 

 

 
  Augļu datu uzņēmumi

Rangs	Yam	Krāsa	Izmērs un balsis
Izlase:	Āboli	Zaļš	Vidējs	500
2. izlase:	Apelsīni	apelsīns	Liels	450
Augļu datu uzņēmumi

Pirms turpināt skaidrojumu, redzēsim, ko šis kods ģenerē pārlūkprogrammā:

Sakļaušanas vērtība, ko ievietojam īpašumā border-collapse, norāda, ka mēs nevēlamies, lai uz katra blakus esošā elementa tiktu novilkta robeža, kas rada efektu, ko redzējām iepriekšējā attēlā.
Atsevišķu malu iestatīšana
Ja tā vietā, lai izmantotu sabrukt mēs izmantojam atsevišķu robežas sakļaušanas noklusējuma vērtību, mēs varam izmantot papildu rekvizītus, piemēram robežu atstarpes Lai definētu atstarpi starp blakus esošo elementu robežām, apskatīsim piemēru:

 Piemērs 
 2011. gada augļu aptaujas rezultāti 

 
 Rangs Yam Krāsa  Izmērs un balsis 

 

 

 
 Izlase: Āboli Zaļš  Vidējs 500 

 
 2. izlase: Apelsīni apelsīns   

 

 
 Augļu datu uzņēmumi

Rangs	Yam	Krāsa	Izmērs un balsis
Izlase:	Āboli	Zaļš	Vidējs	500
2. izlase:	Apelsīni	apelsīns
Augļu datu uzņēmumi

Šajā piemērā mēs vienkārši norādām, ka robežai blakus esošajiem elementiem būs 10 pikseļu atstarpe, apskatīsim piemēru, kā tas tiek tulkots pārlūkprogrammā:

Tukšu šūnu apstrāde
Kā redzējām iepriekšējā attēlā, pārlūkprogramma arī piešķir tukšām šūnām atstarpi ar apmali, dažreiz mēs to nevēlamies savā tabulā, tāpēc mēs varam veikt šādas izmaiņas iepriekšējā kodā, lai varētu tikt galā ar tukšo šūnas.

Apskatīsim, kā tas izskatās pārlūkprogrammā:

Patiešām, mēs varējām atbrīvoties no tukšajām šūnām, nezaudējot mūsu tabulas formātu.
Ar to mēs pabeidzam apmācību, jo mēs redzam, ka mēs varam veikt daudzas izmaiņas mūsu tabulās, lai tās pielāgotu tam, ko mēs varam konceptualizēt un pielāgot savām vajadzībām.Vai jums patika šī apmācība un palīdzējāt tai?Jūs varat apbalvot autoru, nospiežot šo pogu, lai sniegtu viņam pozitīvu punktu