Spisie treści
Są chwile, kiedy nie wszystko jest do wygenerowania formularza w naszych dokumentach HTML, wiele razy musimy dołączyć inne elementy, takie jak obrazy w niektórych tagach, aby ukształtować naszą stronę, w tym samouczku zobaczymy, jak to zrobić i różne funkcje zawarte w sobie.Aby wyświetlić obraz w naszym dokumencie HTML, musimy użyć elementu obrazek który ma następujące atrybuty:
- src
- Alt
- wzrost
- szerokość
- użyj mapy
- ismap
W tej chwili skupimy się na dwóch pierwszych atrybutach, src Tak Alt; src pozwala nam podać ścieżkę, z której przeglądarka będzie szukać obrazu, może to być ścieżka względna lub nawet adres URL, atrybut Alt pozwala na umieszczenie tekstu, ten tekst zostanie wyświetlony tylko wtedy, gdy obraz nie jest dostępny, czy nie znajduje się w ścieżce, w której został określony w src lub nawet przeglądarka nie może tego zinterpretować.
Zobaczmy przykład, jak dołączyć obraz do naszego dokumentu HTML:
Przykład Oto typowa forma reprezentacji trzech aktywności w triathlonie.Pierwsza ikona reprezentuje pływanie, druga reprezentuje jazdę na rowerze, a trzecia bieganie.
W tym przykładzie widzimy jeszcze dwa atrybuty, szerokość i wzrost Mają one, jak wskazują ich nazwy, regulować szerokość i wysokość obrazu, dzięki czemu możemy zagwarantować, że obraz pozostanie w ustalonych przez nas rozmiarach, także jeśli obraz jest większy niż zostanie przewymiarowany, bez Jednak należy uważać, ponieważ obraz będzie miał taką samą wagę, dlatego zaleca się umieszczenie już edytowanego obrazu o wymaganym rozmiarze i aby nasza strona ładowała się szybciej.
Innym dość powszechnym zastosowaniem jest użycie obrazu jako linku do innych stron, albo poprzez umieszczenie ikony zespołu, na przykład następną strzałkę, oczywiście teraz z nowymi frameworkami CSS może to być mniej powszechne, jednak zobaczmy, jak robi się to, aby mieć tę opcję w naszym portfolio narzędzi HTML.
Aby osadzić obraz, po prostu umieścimy element obrazek wewnątrz elementu, który odwołuje się do strony, na przykład:
Przykład Oto typowa forma reprezentacji trzech aktywności w triathlonie.Pierwsza ikona reprezentuje pływanie, druga reprezentuje jazdę na rowerze, a trzecia bieganie.
Dzięki temu osiągamy, że obraz jest teraz naszym linkiem, jak zobaczymy na następnym ekranie, obraz nie zmienia się w sposób, w jaki jest pokazany:
