Ta zapis bo razložil postopek za dodajanje slike v celico tabele v HTML.
Kako dodati sliko v celico tabele v HTML?
HTML ' ” se uporablja za vstavljanje slike v celico tabele.
Sintaksa
Za vdelavo slike v celico tabele sledite sintaksi:
< td >< img src = '' vse = '' premer = '' >< / td >
Tukaj:
- “
” označuje celico tabele, v katero je treba dodati sliko. - “
” se uporablja za določanje slike.
- “ src ” nastavi pot slike.
- “ vse ” označuje besedilo, ki bo prikazano na zaslonu, če se slika ne naloži.
- “ premer ” določa širino slike.
Primer
V datoteki HTML ustvarite tabelo tako, da sledite navedenim navodilom:
- “
” element se uporablja za ustvarjanje tabele. - “
” podaja vrstico. - “
« prilagodi naslov, kjer je » colspan ” Lastnost označuje, koliko stolpcev naj pokriva celica. - “
” ustvari celice tabele za podatke. ' ” so oznake z zahtevanimi atributi vstavljene znotraj te oznake za vdelavo slik v celico tabele: < tabela >
< tr >
< th colspan = '3' stil = 'velikost pisave: 28px;' >Sadje in zelenjava< / th >
< / tr >
< tr >
< th >Ime< / th >
< th stil = 'širina: 250 slikovnih pik;' >Slika< / th >
< th > Sadje / Zelenjava< / th >
< / tr >
< tr >
< td >Jabolko< / td >
< td >< img src = '/images/apples.jpg' vse = 'jabolko' premer = '200' >< / td >
< td >Sadje< / td >
< / tr >
< tr >
< td >Korenček< / th >
< td >< img src = '/images/carrot.jpg' vse = 'korenček' premer = '200' >< / th >
< td >zelenjava< / th >
< / tr >
< tr >
< td >Oranžna< / th >
< td >< img src = '/images/orang.jpg' vse = 'oranžna' premer = '200' >< / th >
< td >Sadje< / th >
< / tr >
< / tabela >Opazimo lahko, da je bila tabela HTML skupaj z vdelanimi slikami uspešno ustvarjena:
CSS
Zdaj bomo razpravljali o lastnostih CSS, ki se uporabljajo za nastavitev postavitve tabele.
Element sloga 'tabela'.
Najprej odprite »
tabela {” po imenu oznake in uporabite naslednje lastnosti:
poravnava besedila : center ;
premer : 800 slikovnih pik ;
zrušitev meje : kolaps ;
marža : avto ;
velikost pisave : 20 slikovnih pik ;
}Opis zgornje kode je podan spodaj:
- “ poravnava besedila ” nastavi poravnavo besedila.
- “ premer ” določa širino tabele.
- “ zrušitev meje Lastnost določa, ali je meja strnjena ali ne.
- “ marža ” doda prostor okoli mize.
- “ velikost pisave ” določa velikost pisave besedila tabele.
Slog elementa »th« in »td«.
th , td {
meja : 1px trdna vijolična ;
}Tukaj je ' meja ” lastnost prilagodi obrobo okoli elementov tako, da poda vrednosti za širino obrobe, slog in barvo.
Izhod
Ta objava govori o vstavljanju slik v celico tabele v HTML.
Zaključek
Če želite dodati sliko znotraj »
', uporabite ' »oznaka znotraj HTML-ja«
” element. Element “ ” določa “ src ” za podajanje URL-ja slike. Natančneje, če želite prilagoditi velikost slike, dodajte » višina « in » premer ” znotraj oznake “
”. Ta spletni dnevnik je ponazoril postopek dodajanja slike v celico tabele HTML.
- “
- “