Paano Gumawa ng Talahanayan Lamang Gamit ang Tag at CSS

” mga tag sa loob nito.

---

---

Halimbawa
Isaalang-alang ang sumusunod na halimbawa ng HTML code upang lumikha ng isang talahanayan:

< div klase = 'divTable' >
< div klase = 'headerRow' >
< div klase = 'divCell' >< b > ID < / b >< / div >
< div klase = 'divCell' >< b > Pangalan < / b >< / div >
< div klase = 'divCell' >< b > Edad < / b >< / div >
< / div >
< div klase = 'divRow' >
< div klase = 'divCell' > 001 < / div >
< div klase = 'divCell' > Smith < / div >
< div klase = 'divCell' > 25 < / div >
< / div >
< div klase = 'divRow' >
< div klase = 'divCell' > 002 < / div >
< div klase = 'divCell' > John < / div >
< div klase = 'divCell' > 31 < / div >
< / div >
< div klase = 'divRow' >
< div klase = 'divCell' > 003 < / div >
< div klase = 'divCell' > Charles < / div >
< div klase = 'divCell' > 28 < / div >
< / div >
< / div >

Sa snippet ng code sa itaas:

• isang '
  Ang 'tag ay idinagdag sa klase na pinangalanang ' divTable ”.
• Sa loob ng ' div ” elemento ng lalagyan, magdagdag ng isa pang “ div ” elemento ng lalagyan na may klase na idineklara bilang “ headerRow ”.
• Muli, magdagdag ng tatlong ' div 'mga elemento na may mga klase na pinangalanan' divRow ” na may tatlong sub container na may “ divCell ” klase.
• Pagkatapos, magdagdag ng tatlong elemento ng div idagdag ang ' ID ”, “ Pangalan 'at' Edad ” sa header row ng table.
• Pagkatapos nito, tukuyin ang mga halaga para sa 'ID', 'Pangalan' at 'Edad' para sa bawat elemento ng div.

Ito ay tungkol sa kung paano gamitin ang ' div ” elemento upang lumikha ng isang talahanayan. Ngayon, ilapat natin ang mga katangian ng CSS dito:

---

---

.divTable
{
display: talahanayan;
lapad :auto;
background- kulay :#eee;
hangganan :1px solid # 666666 ;
border-spacing:5px;
}
.divRow
{
lapad :auto;
display:table-row;
}
.divCell
{
lapad :150px;
lumutang pakaliwa;
display:table-column;
background- kulay : rgb ( 212 , 209 , 209 ) ;
}

Sa itaas na elemento ng estilo ng CSS:

• Magdagdag ng selector na tumutukoy sa “ divTable ” (na naglalaman ng lahat ng mga halaga ng talahanayan) at tukuyin ang nais na mga katangian ng CSS (i.e., “ display ”, “ lapad ”, “ kulay ng background ”, “ hangganan 'at' hangganan-spacing ”) para sa nilalaman ng talahanayan.
• Pagkatapos nito, magdagdag ng tagapili ng klase na pumipili sa mga elemento ng “ divRow 'class para idagdag ang CSS' lapad 'at' display ” katangian sa mga elemento.
• Panghuli, idagdag ang CSS style properties sa mga elemento sa “ .divCell ” tagapili ng klase.

Ito ay lilikha ng isang talahanayan sa output at ipapakita ang mga sumusunod na resulta:

Iyon ay tungkol sa paglikha ng isang talahanayan sa HTML gamit lamang ang mga