Le tabelle sono utilizzate per organizzare i dati in modo leggibile. Hanno un layout simile a un grafico per visualizzare dati, come statistiche, immagini e altro ancora. In HTML, la tabella viene creata usando "
"Elemento e il""Il tag viene utilizzato per incorporare l'immagine in un documento. Gli attributi più significativi utilizzati nel tag "" sono "Al" E "src".
Questo articolo spiegherà una procedura per l'aggiunta di un'immagine all'interno della cella della tabella in HTML.
Come aggiungere un'immagine all'interno della cella della tabella in HTML?
L'HTML “"Il tag viene utilizzato per inserire un'immagine in una cella della tabella.
Sintassi
Segui la sintassi per incorporare un'immagine all'interno della cella della tabella:
Qui:
"
"L'elemento indica la cella della tabella in cui è necessario aggiungere l'immagine.
""Il tag viene utilizzato per specificare l'immagine.
"src"Attributo imposta il percorso dell'immagine.
"Al"Significa il testo che verrà visualizzato sullo schermo nel caso in cui l'immagine non possa caricare.
"larghezza"Determina la larghezza dell'immagine.
Esempio
Nel file HTML, crea una tabella seguendo le istruzioni fornite:
"
"L'elemento viene utilizzato per creare una tabella.
"
"L'elemento specifica una riga.
"
"Regola un'intestazione dove"Colspan"La proprietà indica quante colonne dovrebbe coprire una cella.
"
"Crea celle da tabella per i dati. IL ""I tag con gli attributi richiesti vengono inseriti all'interno di questo tag per incorporare le immagini in una cella di tabella:
Frutta e verdura
Nome
Immagine
Frutta/verdura
Mela
Frutta
Carota
Verdura
Arancia
Frutta
Si può osservare che la tabella HTML è stata creata con successo insieme a immagini incorporate:
CSS
Ora discuteremo delle proprietà CSS utilizzate per impostare il layout del tavolo.
Elemento "tavolo" di stile
Innanzitutto, accedi al "
"Elemento per nome del tag e applicare le seguenti proprietà: tavolo Testo-align: centro; larghezza: 800px; Collapse di confine: collasso; Margine: auto; Font-size: 20px;
Di seguito è riportata la descrizione del codice sopra:
"allineamento"Imposta l'allineamento del testo.
"larghezza"Determina la larghezza della tabella.
"Collapse al confine"La proprietà definisce se il confine è crollato o meno.
"margine"Aggiunge spazio attorno al tavolo.
"dimensione del font"Definisce la dimensione del carattere di testo della tabella.
Elemento stile "Th" e "TD"
th, td bordo: 1px viola solido;
Qui, il "confine"La proprietà regola il bordo attorno agli elementi specificando i valori per la larghezza, lo stile e il colore del bordo.
Produzione
Questo post riguarda l'inserimento di immagini nella cella della tabella in HTML.
Conclusione
Per aggiungere un'immagine all'interno del "
"Cella, usa il""Tag all'interno dell'HTML"
"Elemento. L'elemento "" specifica il "src"Attributo per fornire l'URL dell'immagine. Più specificamente, per regolare la dimensione dell'immagine, aggiungi il “altezza" E "larghezza"Attributi all'interno del tag" ". Questo blog ha illustrato la procedura per aggiungere un'immagine nella cella della tabella HTML.