Tabele są wykorzystywane do uporządkowania danych w czytelny sposób. Mają układ podobny do wykresu do wyświetlania danych, takich jak statystyki, obrazy i inne. W HTML tabela jest tworzona za pomocą „
”Element i„”Tag służy do osadzenia obrazu w dokumencie. Najważniejsze atrybuty używane w znaczniku „” to „Alt" I "src".
Ten zapis wyjaśni procedurę dodawania obrazu wewnątrz komórki tabeli w HTML.
Jak dodać obraz wewnątrz komórki tabeli w HTML?
HTML "”Tag jest wykorzystywany do wstawienia obrazu do komórki tabeli.
Składnia
Postępuj zgodnie z składnią, aby osadzić obraz wewnątrz komórki tabeli:
Tutaj:
"
”Element wskazuje komórkę tabeli, w której należy dodać obraz.
"”Tag jest wykorzystywany do określenia obrazu.
"src”Atrybut ustawia ścieżkę obrazu.
"Alt”Oznacza tekst, który zostanie wyświetlony na ekranie na wypadek, gdyby obraz nie ładuje się.
"szerokość”Określa szerokość obrazu.
Przykład
W pliku HTML utwórz tabelę, postępując zgodnie z podanymi instrukcjami:
"
„Element jest wykorzystywany do utworzenia tabeli.
"
”Element określa wiersz.
"
”Dostosowuje nagłówek, w którym„Colspan”Właściwość oznacza, ile kolumn powinna pokryć komórkę.
"
”Tworzy komórki tabeli dla danych. „„”Tagi z wymaganymi atrybutami są wstawiane do tego znacznika, aby osadzić obrazy w komórce tabeli:
Owoce i warzywa
Nazwa
Zdjęcie
Owoce/warzywo
Jabłko
Owoc
Marchewka
Warzywo
Pomarańczowy
Owoc
Można zauważyć, że tabela HTML została pomyślnie utworzona wraz z wbudowanymi obrazami:
CSS
Teraz omówimy właściwości CSS wykorzystywane do ustawienia układu tabeli.
Element „tabeli” stylu
Najpierw uzyskaj dostęp do „
”Element według nazwy znacznika i zastosuj następujące właściwości: tabela Text-Align: Center; szerokość: 800px; Zakładanie granic: upadek; Margines: Auto; Rozmiar czcionki: 20px;
Opis powyższego kodu podano poniżej:
"tekst-align”Ustawia wyrównanie tekstu.
"szerokość”Określa szerokość stołu.
"Zakładanie granic„Własność określa, czy granica jest zwinięta, czy nie.
"margines”Dodaje przestrzeń wokół stołu.
"rozmiar czcionki”Definiuje rozmiar czcionki tekstu tabeli.
Element stylu „TH” i „TD”
th, td granica: 1px solidny fiolet;
Tutaj "granica„Właściwość dostosowuje granicę wokół elementów, określając wartości szerokości granicy, stylu i koloru.
Wyjście
Ten post dotyczy wkładania obrazów w komórce tabeli w HTML.
Wniosek
Aby dodać obraz wewnątrz „
”Komórka, użyj„„Tag w HTML”
" element. Element „” określa „src”Atrybut dostarczenia adresu URL obrazu. Dokładniej, aby dostosować rozmiar obrazu, dodaj „wysokość" I "szerokość„Atrybuty w znaczniku„ ”. Ten blog zilustrował procedurę dodania obrazu w komórce tabeli HTML.
