Slike dodajo življenje na svoje spletne strani in pritegne pozornost gledalcev. Napisi ponujajo dodatne informacije o vaših spletnih slikah, vendar jih je težko dodati na spletne strani brez naprednih znanj HTML in CSS. Tukaj je zanesljiva metoda za dodajanje preprostega, a privlačnega naslova na sliko, ki ostane s sliko, kjer koli jo premaknete na spletno stran.
Koraki za slikovno kodo HTML
-
Dodajte sliko na svojo spletno stran.
-
V HTML-ju za svojo spletno stran postavite oznako div pod sliko:
-
Dodajte atribut sloga oznaki »div«:
style = ""> -
Določite širino diva na enako širino kot slika, s slogom širine sloga:
-
Za napise, ki so nekoliko manjše od okoliškega besedila, dodajte velikost pisave v slog div:
-
Napisi so najprimernejši, če so centrirani pod sliko, zato dodajte lastnosti za prilagajanje besedila atributu sloga:
-
Na koncu dodajte še nekaj dodatnega prostora med sliko in napisom, tako da dodate atribut sloga sliki s slogom oblike sloga za obliko:
style = "padding-bottom: 0.5em;" />
-
Nato natipkanje besedila dodajte neposredno pod sliko:
Prenesite spletno stran na strežnik in jo preizkusite v brskalniku.
Napotitveni nasveti
- Razsežnosti CSS so lahko v številnih različnih meritvah, zato morate običajno vključiti vrsto merjenja. Na primer:
širina: 100px; Vendar pa so dimenzije HTML slike vedno v slikovnih pikah, tako da merjenje izklopite.
širina = "100"
- Če širino širine širite od širine slike, se lahko slika prikaže poleg slike. Če je to tisto, kar želite, dodajte
oznako neposredno pred napisom in po slikovnih oznakah.
