Tabela HTML TR wewnątrz TD

Tabela HTML TR wewnątrz TD

W HTML tabele są zaprojektowane w celu zorganizowania zbyt obszernych lub złożonych danych i są w pełni reprezentowane w akapicie. Umożliwia czytelnikowi szybkie przeglądanie ustaleń. Ponadto tabele można wykorzystać do koncentrowania się na rozwoju lub wzorcach w ramach informacji oraz do zwiększenia dostępności artykułu poprzez wykluczenie informacji ilościowych opartych na tekst.

Ten post wyjaśnia metodę tworzenia tabeli „" w środku "" element.

Jak utworzyć tabelę „" Wewnątrz ""?

Aby utworzyć tabelę „" w środku "”Po pierwsze, zrób stół z„

" element. Następnie w „„”Tag.

Aby uzyskać praktyczne implikacje, wypróbuj podaną procedurę.

Krok 1: Zrób pojemnik „Div”

Najpierw skorzystaj z „„Element do stworzenia kontenera Div. Włóż także „ID”Lub atrybut klasowy o określonej nazwie. W takim przypadku atrybut ID jest przypisany wartość „treść".

Krok 2: Utwórz tabelę

Następnie utwórz tabelę z pomocą „

”Element, zdefiniuj wiersze tabeli za pomocą„
”Tag. Ponadto, wstaw wiersze tabeli za pomocą „”Element i dane z„" Wewnątrz "”Tag. Postępując zgodnie z tą samą procedurą podaną powyżej:


".

Krok 3: Dodaj „

”Tag

Wewnątrz elementu TD włóż kolejny wiersz za pomocą „
















Pierwsza organizacjaDruga organizacja
Rząd tabeli wewnątrz danych tabeli
Rząd tabeli wewnątrz danych tabeli
Trzecia organizacja Czwarta organizacja

Wyjście

Jak stylizować stół „" wewnątrz ""?

Aby stylizować stół „" wewnątrz "”, Użytkownicy mogą korzystać z różnych właściwości CSS. Aby to zrobić, postępuj zgodnie z daną procedurą.

Krok 1: Zastosuj styl CSS na pojemniku „treści”

Uzyskać dostęp do "div”Pojemnik za pomocą„ID„Wartość, która jest”treść”I zastosuj następujące właściwości CSS:

#treść
granica: 4px Solid RGB (8, 50, 238);
Kolor: RGB (243, 152, 15); kolor tła: RGB (194, 240, 241);
Margines: 30px 50px;
Wyściółka: 30px;

Tutaj:

  • "granica”Definiuje granicę wokół elementu.
  • "kolor”Służy do określenia koloru dodanego tekstu wewnątrz elementu zgodnie z przypisaną wartością.
  • "margines„Przydziela przestrzeń wokół granicy elementu.
  • "wyściółka”Dodaje przestrzeń wokół elementu wewnątrz granicy.

Krok 2: Zastosuj granicę wokół danych tabeli

Dostęp "tabela" I "TD„W CSS:

Tabela TD
Border: 3px Groove Green;

Zastosuj właściwość graniczną CSS do określenia granicy wokół danych tabeli.

Wyjście

Krok 3: styl „TR” wewnątrz „TD”

Teraz stygnij „tr„To jest zdefiniowane w„TD„Używając nazwy klasy z selektorem kropkowym jako„.Row stołowy”:

.TABLE-ROW> TD
Wyściółka: 10px;
granica: 3px kropkowane RGB (233, 64, 12);
Kolor: RGB (15, 15, 15);

Tutaj zastosuj właściwości CSS zgodnie z wyborem. W naszym przypadku „wyściółka”,„granica", I "kolor”Służą do stylizacji wierszy tabeli w danych tabeli.

Z danego wyjścia można zaobserwować, że pomyślnie dodaliśmy „" wewnątrz "”I odpowiednio go stylizował:

Chodzi o dodanie i stylizację stołu TR wewnątrz TD.

Wniosek

Aby wstawić tabelę TR do TD, najpierw utwórz tabelę, wykorzystując „

”Tag. Następnie określ „" I "„Aby dodać wiersze w tabeli danych i stylizować je za pomocą właściwości CSS. Ten post wyjaśnił o dodaniu tabeli TR wewnątrz TD.

„Wewnątrz stołu. Potem, w „”Tag, wstaw„