1 00:00:00,000 --> 00:00:00,170 2 00:00:00,170 --> 00:00:02,740 >> SPEAKER 1: Anta at du har noen tabelldata som du ønsker å layout 3 00:00:02,740 --> 00:00:05,470 i en web-side i en tabell, med rader og kolonner. 4 00:00:05,470 --> 00:00:06,540 Hvordan kan vi gjøre dette? 5 00:00:06,540 --> 00:00:10,480 >> Vel, på forhånd her jeg har fått gang med table.html, med noen 6 00:00:10,480 --> 00:00:12,300 åpne koder og noen lukkede koder. 7 00:00:12,300 --> 00:00:15,890 Innsiden av kroppen nå, la oss inkludere tabellen taggen. 8 00:00:15,890 --> 00:00:19,300 Og preemptively, bare så jeg ikke glemme, la oss inkludere den nære bordet 9 00:00:19,300 --> 00:00:20,760 merke også. 10 00:00:20,760 --> 00:00:24,830 Innsiden av det, la oss spesifisere en tabell rad med en tr tag. 11 00:00:24,830 --> 00:00:27,300 Og, også preemptively, lukke det. 12 00:00:27,300 --> 00:00:31,550 >> Nå inne i denne raden, la oss definere kolonner eller data som vil være 13 00:00:31,550 --> 00:00:34,050 Innsiden av disse kolonner, eller cellene deri. 14 00:00:34,050 --> 00:00:37,470 For å gjøre dette, la oss bruke den td tag for tabelldata. 15 00:00:37,470 --> 00:00:39,730 Åpen brakett td nær brakett. 16 00:00:39,730 --> 00:00:42,490 Og nå, hva om vi starter å simulere En telefon numre. 17 00:00:42,490 --> 00:00:45,890 La oss starte med en, og deretter lukke denne tabellen data tag. 18 00:00:45,890 --> 00:00:47,840 La oss åpne en ny en med to. 19 00:00:47,840 --> 00:00:49,200 Lukk at en også. 20 00:00:49,200 --> 00:00:50,270 Og så en tredje. 21 00:00:50,270 --> 00:00:52,980 td tre nær td. 22 00:00:52,980 --> 00:00:54,000 >> Hvor skal jeg med dette? 23 00:00:54,000 --> 00:00:57,840 Vel, hevder jeg at fordi vi har en tabell rad, innsiden av som vi har 24 00:00:57,840 --> 00:01:02,950 tre bord datasett, vi i hovedsak har begynnelsen på en tabell som har en 25 00:01:02,950 --> 00:01:04,590 rad og tre kolonner. 26 00:01:04,590 --> 00:01:06,640 La oss nå gi det litt ekstra rader. 27 00:01:06,640 --> 00:01:11,300 >> Under nær tr tag, la oss åpne en annen tr tag, og preemptively nær 28 00:01:11,300 --> 00:01:12,510 at man også. 29 00:01:12,510 --> 00:01:21,600 Innsiden av det, la oss nå do td 4, td 5, og td 6. 30 00:01:21,600 --> 00:01:23,470 Under denne raden, la oss gjøre en tredje. 31 00:01:23,470 --> 00:01:25,680 Åpne tabellen rad, tett tabellen rad. 32 00:01:25,680 --> 00:01:34,970 Innsiden av det, td 7, td 8 og 9. td. 33 00:01:34,970 --> 00:01:37,910 >> Til slutt, bare for å gjøre ting interessant, La oss fullføre bunnen 34 00:01:37,910 --> 00:01:39,430 av denne telefonen pad. 35 00:01:39,430 --> 00:01:42,530 Åpen tr og nær tr. 36 00:01:42,530 --> 00:01:51,530 Og inne på det, td stjerne, td 0, og td pund. 37 00:01:51,530 --> 00:01:54,090 La oss nå lagre denne filen, endring sine tillatelser, og 38 00:01:54,090 --> 00:01:56,440 se den med en nettleser. 39 00:01:56,440 --> 00:02:00,220 >> Chmod a + r table.html. 40 00:02:00,220 --> 00:02:02,300 La oss nå åpne Chrome. 41 00:02:02,300 --> 00:02:08,430 http://localhost/table.html. 42 00:02:08,430 --> 00:02:11,610 Og der har vi det som vises være en HTML-tabell. 43 00:02:11,610 --> 00:02:13,920 Det ikke helt ser ut som jeg forventet. 44 00:02:13,920 --> 00:02:17,650 La oss i det minste legge en grense nå rundt alle disse tabellceller. 45 00:02:17,650 --> 00:02:21,670 >> La oss gå tilbake til gedit og bla opp til bordet merkelappen selv. 46 00:02:21,670 --> 00:02:25,130 Og la oss legge til et attributt, kjent som "Grensen", som angir et numerisk 47 00:02:25,130 --> 00:02:27,310 verdi for bredden av en kant. 48 00:02:27,310 --> 00:02:31,160 Border tilsvarer quote unquote 1, hvor 1 betegner bredden 49 00:02:31,160 --> 00:02:32,400 av tabellen grense. 50 00:02:32,400 --> 00:02:36,920 La oss lagre filen, og legg siden i nettleseren min. 51 00:02:36,920 --> 00:02:38,920 >> Tilbake i Chrome, reload. 52 00:02:38,920 --> 00:02:39,860 Og der har vi det. 53 00:02:39,860 --> 00:02:42,550 Veldig stygg, men likevel tabelldata. 54 00:02:42,550 --> 00:02:44,694