Attēli pievieno dzīvi jūsu tīmekļa lapām un pievērš skatītāju uzmanību. Paraksti sniedz papildu informāciju par jūsu tīmekļa attēliem, taču tos var būt grūti pievienot tīmekļa lapām bez uzlabotas HTML un CSS prasmēm. Šeit ir drošs veids, kā pievienot vienkāršu, bet pievilcīgu parakstu attēlam, kas paliek kopā ar attēlu jebkurā vietā, kur to pārvietojat tīmekļa lapā.
Darbības ar HTML attēlu parakstu
-
Pievienojiet attēlu savai tīmekļa lapai.
-
Jūsu tīmekļa lapas HTML vietā ievietojiet div tagu ap attēlu:
-
Pievienojiet stila atribūtu div tagam:
stils = ""> -
Iestatiet div platumu tādam pašam platumam kā attēlam, izmantojot platuma stila rekvizītu:
-
Parakstiem, kas ir nedaudz mazāki par apkārtējo tekstu, pievienojiet divu stilam fonta izmēra īpašību:
-
Paraksti izskatās vislabāk, ja tie atrodas zem attēla, tāpēc stila atribūtam pievienojiet teksta izlīdzināšanas īpašību:
-
Visbeidzot, pievienojiet nedaudz papildu atstarpi starp attēlu un parakstu, pievienojot stila atribūtu attēlam ar padding-bottom stila īpašumu:
style = "padding-bottom: 0.5em;" />
-
Tad pievienojiet teksta parakstu tieši zem attēla:
Augšupielādējiet tīmekļa lapu savā serverī un pārbaudiet to pārlūkprogrammā.
Parakstu padomi
- CSS izmēri var būt dažādi mērījumi, tāpēc parasti ir jāiekļauj mērījumu veids. Piemēram:
platums: 100px; Tomēr HTML attēla izmēri vienmēr ir vienāds ar pikseļiem, tāpēc atstājat mērījumu.
platums = "100"
- Ja jūs izveidojat platuma platumu divi plašāk par attēla platumu, virsraksts var parādīties blakus attēlam. Ja tas ir tas, ko vēlaties, pievienojiet
atzīmējiet tieši pirms paraksta un pēc attēla taga.
