Przejdź do treści

zdjecie - Kurs HTML i CSS

  • HTML
    HTML5 / Responsywny obrazek <picture, source>

    ...tego nie zrobimy, w starszych przeglądarkach nie zostanie wyświetlony żaden obrazek. Przykład <picture, source type> <picture> <source srcset="zdjecie.webp" type="image/webp"> <source srcset="zdjecie.jxr" type="image/vnd.ms-photo"> <img src="zdjecie.jpg" alt="Przykładowe zdjęcie"> </picture> Jeśli przeglądarka nie będzie obsługiwać żadnego z nowoczesnych formatów graficznych, wtedy na ekranie zostanie wyświetlony obrazek: "zdjecie.jpg". Dopasowanie kadru <picture, source media>...

  • HTML
    HTML dla zielonych / Odsyłacz obrazkowy HTML <a href, img src alt "border">

    ...Dzięki temu odsyłacz zadziała bez względu na to, czy użytkownik kliknie bezpośrednio w zdjęcie czy może w jego podpis. Na przykład: <a href="duze-zdjecie.jpg"><img src="male-zdjecie.jpg" alt="Zobacz duże zdjęcie" style="border: 0"><br> Tu wpisz podpis zdjęcia</a>.

  • HTML
    HTML5 / Załącznik <figure, figcaption>

    ...opisu pod zdjęciem jest umieszczenie na stronie znacznika FIGURE, a wewnątrz niego IMG i FIGCAPTION. Na przykład jeśli plik zdjęcia nazywa się "zdjecie.jpg" i znajduje się w tym samym katalogu co dokument *.html, w którym chcemy go wstawić, można się posłużyć następującym kodem: <figure> <img src="zdjecie.jpg" alt="Tekst zastępczy"> <figcaption>Podpis zdjęcia</figcaption> </figure>. W odróżnieniu od tekstu zastępczego - który jest używany na wypadek, gdyby zdjęcie nie mogło być załadowane...

  • Skrypty
    Ochrona strony

    ...alert('Wydruk jest niedostępny!')" onafterprint="document.body.style.visibility = 'visible'"> ... </body> Blokada zapisu wybranych zdjęć <img src="zdjecie.jpg" alt="Tekst alternatywny" onmousedown="return false" oncontextmenu="return false" onselectstart="return false" onselect="return false" oncopy="return false" ondragstart="return false" ondrag="return false"> [Zobacz: Obrazek] Blokada paska narzędziowego obrazów Pasek narzędziowy obrazów to zestaw ikon, który w niektórych...

  • Ćwiczenia
    Odsyłacze HTML / Ćwiczenia

    ...użyć opcji "Zmień rozmiar"). Następnie zapisz małe zdjęcie na dysku pod inną nazwą, ale z tym samym rozszerzeniem nazwy pliku (na przykład: moje-zdjecie-mini.jpg). Aby zapewnić dobrą jakość zdjęcia, zawsze pomniejszaj pełnowymiarową ilustrację, a nigdy nie powiększaj miniaturki. Podmień ilustracje na stronie na ich wersje pomniejszone. Następnie przekształć je w odsyłacze obrazkowe i podlinkuj do pełnowymiarowych wersji zdjęć. Użyj przy tym atrybutu target="_blank", który otworzy zdjęcie w...

  • Skrypty
    Galeria zdjęć HTML / Skrypt galerii zdjęć

    ...którą musisz dodatkowo zrobić, to do znaczników odsyłaczy z powiększonymi zdjęciami dodaj atrybut data-gallery. Na przykład: <a data-gallery href="zdjecie1.jpg"><img src="miniatura1.jpg" border="0"></a> <a data-gallery href="zdjecie2.jpg"><img src="miniatura2.jpg" border="0"></a> <a data-gallery href="zdjecie3.jpg" title="Opis"><img src="miniatura3.jpg" border="0"></a> miniatura1.jpg, miniatura2.jpg, miniatura3.jpg Lokalizacje fizycznie pomniejszonych odpowiedników pełnowymiarowych...

  • HTML
    Nagłówek i treść HTML / Dokumenty prawne <link "license, privacy-policy, terms-of-service">

    ...W takiej sytuacji przy każdym takim elemencie powinniśmy osobno wskazać właściciela praw autorskich i licencję. Na przykład: <figure> <img src="zdjecie.jpg" alt="Tatry"> <figcaption>Tatry<br><small>&copy; Jan Kowalski (<a rel="license" href="https://creativecommons.org/licenses/by/4.0/deed.pl">CC BY</a>)</small></figraption> <figure> Polityka prywatności (przetwarzanie danych osobowych) <link "privacy-policy"> <head> <link rel="privacy-policy" href="ścieżka dostępu"> </head> W 2018...

★★★★★ 5/5 (289)

Facebook