Zawartość
zrecenzowany przez
Oto niezawodny sposób dodania prostego, ale atrakcyjnego podpisu do obrazu, który pozostaje z obrazem w dowolnym miejscu na stronie.
Kroki do podpisu obrazu HTML
-
Dodaj obraz do swojej strony internetowej.
-
W kodzie HTML swojej strony umieść tag div wokół obrazu:
-
Dodaj atrybut stylu do znacznika div:
style = ""> -
Ustaw szerokość div na tę samą szerokość co obraz, za pomocą właściwości style width:
-
W przypadku podpisów, które są nieco mniejsze niż otaczający tekst, dodaj właściwość rozmiar czcionki do stylu div:
-
Podpisy wyglądają najlepiej, jeśli są wyśrodkowane poniżej obrazu, więc dodaj atrybut wyrównania tekstu do atrybutu stylu:
-
Na koniec dodaj trochę dodatkowego odstępu między obrazem a podpisem, dodając do obrazu atrybut stylu za pomocą właściwości stylu padding-bottom:
style = "padding-bottom: 0.5em;" />
-
Następnie dodaj podpis tekstowy bezpośrednio pod obrazem:
Prześlij stronę internetową na swój serwer i przetestuj w przeglądarce.
Wskazówki dotyczące napisów
Wymiary CSS mogą być w wielu różnych pomiarach, więc zwykle musisz uwzględnić typ pomiaru. Na przykład:
Jednak wymiary obrazu HTML są zawsze wyrażone w pikselach, więc pomijasz pomiar.
Jeśli szerokość div będzie większa niż szerokość obrazu, podpis może pojawić się obok obrazu. Jeśli tego właśnie chcesz, dodaj
tag bezpośrednio przed podpisem i po tagu obrazu.
