Istnieją różne sposoby reprezentowania danych i informacji, takich jak wykresy, wykresy, piktografy lub formularze tabelaryczne. Tabela organizuje dane w rzędach i kolumnach, dzięki czemu dane są bardziej czytelne i jasne. Dane tabelowane oszczędzają również czas i przestrzeń. Aby zrobić tabele w HTML, używamy
tag z
etykietka,
tag do kierowania i
dla danych tabeli.
Efekty uczenia się tego artykułu będą:
Co to jest HTML
Etykietka?
Jak utworzyć tabelę w HTML?
Jakie są atrybuty
Etykietka?
Jak utworzyć pionowy stół nagłówka?
Co to jest HTML
Etykietka?
HTML
znacznik określa wiersz w tabeli,
znacznik służy do nagłówka stołowego i
Tag dotyczy danych tabeli.
Składnia
…
Tag HTML TR ma znacznik początkowy
i zamykający znacznik
.
Jak utworzyć tabelę w HTML?
Poniższy przykład pokaże, w jaki sposób możemy utworzyć tabelę w HTML. Aby to zrobić, najpierw dodaj
Tag, a następnie podać podpis za pomocą znacznika:
Informacje o uczniach
W elemencie tabeli, dodaj
tag po podpisie. Pierwszy rząd będzie zawierał nagłówek każdej kolumny. Dla tego
Używane są tagi:
Roll no
Nazwa ucznia
DOB
Po utworzeniu trzech kolumn dodajmy dane do kolumn. Dane zostaną dodane do każdego wiersza w korespondencji z nagłówkami w następnym wierszu. Aby dodać dane,
Tag jest używany:
1
Jan
23-05-1997
Podobnie utwórz jeszcze dwa wiersze, jak pokazano w fragmencie kodu poniżej:
2
William
02-9-1995
3
Stokrotka
12-03-1998
Odpowiednie wyjście wspomnianego wyżej kodu będzie wyglądało tak:
Stosowanie stylów do stołu z CSS
W tej sekcji zastosujemy niektóre właściwości stylizacji do tabeli, którą stworzyliśmy powyżej.
"margines„Własność o wartości”automatyczny”Umieszcza stół w środkowym odstępiecie z każdej strony.
"szerokość„Własność jest wykorzystywana do ustawienia szerokości tabeli.
"wysokość”Właściwość ustawia wysokość stołu.
Wyjście
Jakie są atrybuty
Etykietka?
Istnieje wiele atrybutów związanych z HTML
tag, taki jak:
Rowpan
Colspan
Atrybut: RowsPan
Ten atrybut zawiera nieujemną wartość, która określa liczbę wierszy, które komórka rozszerza. Jego domyślna wartość to 1.
Przykład: Jak dodać atrybut RowsPan do wiersza tabeli? Z powyższego przykładu wzięliśmy drugi rząd. Dodaj Rowspan atrybutu z wartością 2 do danych z trzeciej tabeli:
2
William
02-9-1995
Można to zobaczyć na poniższym obrazku, że trzecie dane drugiego rzędu zajęły miejsce dwóch wierszy:
Atrybut: Colspan
Ten atrybut zawiera nieujemną wartość, która określa liczbę kolumn, które komórka rozszerza. Domyślna wartość Colspan wynosi 1. Większe niż 1000 wartości zostanie ustawione jako domyślne, ponieważ są one uważane za nieprawidłowe.
Przykład: Jak dodać atrybut Colspan do wiersza tabeli? W pliku HTML,
Tag jest dodawany poniżej znacznika i jest dostarczany z atrybutem Colspan o wartości 3:
Linuxhint School
Z poniższego obrazu widać, że nagłówek tabeli zajęł miejsce dla trzech kolumn:
Jak utworzyć pionowy stół nagłówka?
W HTML dodaj trzy
tagi. Wewnątrz siebie umieszczane są inne znaczniki, takie jak
, Następnie
tagi. W taki sposób można utworzyć tabelę z nagłówkami pionowymi:
Nazwa
Tomek
Andrzej
Miasto
Stany Zjednoczone
Chiny
Zawód
Instruktor
Lekarz
Zapisz plik HTML i otwórz plik w przeglądarce internetowej:
Można zaobserwować, że nagłówek stołu jest umieszczany pionowo.
Wniosek
Aby utworzyć tabelę dla naszej aplikacji internetowej, HTML zapewnia nam różne znaczniki dla tabel, wierszy i kolumn jako
,
, I
, odpowiednio. Tak więc ten blog wyjaśnił HTML
tag, jego atrybut i metoda utworzenia prostej i pionowej tabeli nagłówka.
