Menu
Coddy logo textTech
ZACZNIJ NAUKĘ
flag Pl iconPolskidown icon

Zdjęcie profilowe

Część sekcji Podstawy ścieżki HTML w Coddy. Lekcja 32 z 60.

challenge icon

Wyzwanie

Łatwy

Dobrze, czas dodać zdjęcie profilowe! Możesz użyć dowolnego obrazu. Możesz skorzystać z linku z poniższego przykładu.

  1. Po pierwszym elemencie <div> (sekcji nagłówka) utwórz kolejny element <div>. Wewnątrz dodaj znacznik <img>.
  2. Ustaw src, aby wskazywał na Twój obraz, i użyj atrybutów width oraz height, aby kontrolować jego rozmiar.

Na przykład:

  • src - https://storage.googleapis.com/coddy-15505.appspot.com/public/avatars/avatar25.png
  • width - 200
  • height - 200"

Spróbuj swoich sił

<!DOCTYPE html>
<html>
    <body>
        <!-- Header Section -->
        <div>
            <h1>John Doe</h1>
            <p>Web Developer | Creative Thinker</p>
        </div>
    </body>
</html>

Wszystkie lekcje w sekcji Podstawy

1Podstawy HTML

Czym jest HTML?Podstawowa struktura dokumentu HTMLTagi i elementyZagnieżdżanie i zamykanie tagówKomentarze w HTML

4Karta przepisu

Przegląd projektuTytuł i opis przepisuLekcja projektowaSkładnikiLekcja projektowaKrokiLekcja projektowa

7Strona profilu osobistego

Omówienie projektuSekcja nagłówkaLekcja projektowaZdjęcie profiloweLekcja projektowaSekcja „O mnie”Lekcja projektowaLinki do mediów społecznościowychLekcja projektowa

10Tabele

Podstawy tabelDodawanie podpisówScalanie wierszy i kolumnPodsumowanie – tabele

2Tekst i formatowanie

NagłówkiAkapityPodziały wierszaTekst pogrubiony i pochylonyPonownie: tekst pogrubiony i pochylonyPodsumowanie — formatowanie

5Dodawanie treści

Atrybuty HTMLLinkiLinki do nowych stronObrazyAtrybuty obrazów

8Formularze i pola wejściowe, część 1

Podstawy formularzyPola tekstoweAtrybuty pólPole hasłaEtykiety pólPodsumowanie – podstawowy formularz

11Strona rejestracji na wydarzenie

Przegląd projektuSekcja nagłówkaLekcja projektowaSekcja szczegółów wydarzeniaLekcja projektowaFormularz rejestracyjnyLekcja projektowaSekcja stopkiLekcja projektowa

3Praca z listami

Lista nieuporządkowanaLista uporządkowanaListy zagnieżdżonePodsumowanie — listy

6Układ strony

Elementy blokoweElementy linioweZnaczniki semantyczneSekcje i artykułyPodsumowanie — układ

9Formularze i pola wejściowe, część 2

Przyciski opcjiPola wyboruListy rozwijanePrzyciskiPrzyciski w formularzachPowtórzenie — formularze nr 1Powtórzenie — formularze nr 2

12Końcowe wyzwania

Prosta karta profilowaKarta zaproszenia na wydarzenieProsta strona artykułuLista ulubionych książek

Poćwicz samodzielnie: Edytor online Web